Browser tool
Pixel studio
Draw one tile, then check how it repeats. The grid is the tile itself. The preview beside it shows the same tile three across and three down, so you can see whether the edges meet before you commit.
Draw a tile
Choose a brush color, then click or drag across the grid to paint. Use the eraser to clear cells, or clear the whole grid at once.
The grid is twelve cells wide and twelve cells tall. Use the arrow keys to move between cells, and press Enter or Space to paint the cell you are on.
Painted cells appear in the preview at the same positions in every copy, so a shape that leaves one edge of the grid should re-enter the opposite edge.
How to use the studio
- Choose a brush color with the color control. Choosing a color turns the eraser off.
- Click or drag across the grid to paint. Release the pointer and the status line summarizes the cells you crossed.
- To paint from the keyboard, press Tab to reach the grid, then use the arrow keys to move between cells. Press Enter or Space to paint the cell you are on.
- Press Eraser, then paint over cells to clear them. Press Eraser again, or choose a color, to paint again.
- Clear grid removes every painted cell after you confirm.
Checking an edge
Look at the top row against the bottom row, and the left column against the right. A shape cut by one edge should continue from the opposite edge in the preview, at the same height or width.
Shapes that touch the border of the tile usually make the strongest repeats. Empty margins can look good on their own, then show a gap once the tiles sit side by side.
Your drawing lives only in this browser tab. Nothing is sent to a server, and reloading the page starts with an empty grid.