Pixel Game

Resolution

Colour Mode

Grid Colour

Upload Image

Reference Image no image loaded

Ref Grid

Upload an image to start

Your image will be pixelated here

Your Canvas 0% filled

Canvas Grid

Zoom

Match: —

Challenge Mode

Pick a category, choose a level, and recreate the image pixel by pixel.

⌨ Code It

Write JavaScript to draw patterns on the pixel canvas. Use the API below.

// pixel(x, y, color) · rect(x1, y1, x2, y2, color) · circle(cx, cy, radius, color) · clear() // grid = resolution (e.g. 15) · color = any CSS color string e.g. '#E63946'

// Concentric circles
const cx = grid / 2, cy = grid / 2;
circle(cx, cy, grid * 0.42, '#4CC9F0');
circle(cx, cy, grid * 0.28, '#E63946');
circle(cx, cy, grid * 0.14, '#E9C46A');
circle(cx, cy, grid * 0.05, '#2A9D8F');

Resolution

Grid

Grid Colour

Zoom

Challenge Mode

⌨ Code It

Side by Side