Skip to site navigation
GridNothing leaves this tab

Grid maker

Drop a reference photo in and it comes back with a drawing grid over it, ready to copy square by square.

Preview
Portrait, window light, reference image with a drawing grid overlay

Portrait, window light · 1024×1536px · sample image

1Image
No file added yet — the preview above is a sample.
2Grid
3Export

Results live only in this tab. Download before you refresh or close it.


Mechanism

How the grid is drawn

The image is measured once, in pixels, and the drop zone reports its natural width and height. Column and row counts are divided into that pixel size to get an evenly spaced set of lines — for N columns the vertical lines land at width/N, 2·width/N, and so on, with no rounding drift because each line is computed from the original edge rather than by stepping forward from the last one. The live preview draws those lines with plain CSS, an overlay grid with the same column and row count sitting on top of the picture, so nothing is decoded or re-encoded while you are still turning knobs. Only the export step touches a canvas: the image is drawn once at its working resolution, the same grid lines are drawn on top of it in the colour, width and opacity you chose, and the result is read back out as a single PNG.

Limits

Where this grid maker falls short

  • A very large photo is downscaled before it reaches the canvas, so the exported grid is not always at the source file's full resolution. The on-screen size is shown next to the file name.
  • The export is a flattened PNG: image and grid lines baked into one layer. There is no layered file to reopen and adjust later — change the settings and export again instead.
  • Only an evenly spaced grid. This does not build a perspective grid that follows vanishing points, which is a different tool solving a different problem.
  • Grid lines are drawn from the image edges inward, so a column count that does not divide the width evenly still produces uniform spacing — the discrepancy, if any, is sub-pixel and not something you would notice.
Questions

Questions about the grid maker

Is this grid maker free?
Yes, free, with no account and no watermark on the export. The image never leaves your device, so there is no server cost behind the site to recover from you.
What is a drawing grid actually for?
It breaks a reference image into equal squares so you can copy or scale it one square at a time, matching what falls in each cell rather than judging proportions across the whole picture at once. It is a decades-old technique from analogue transfer paper, done here without printing anything.
How many columns and rows should I use?
More squares make each one easier to copy accurately but slower to get through; fewer squares are faster but demand more freehand judgement inside each cell. A common starting point for a portrait or a detailed reference is somewhere between 8 and 16 divisions on the longer side — this tool does not enforce a default beyond that, since it depends on the image and your own hand.
Can I use a non-square grid, like 8 columns and 12 rows?
Yes. Columns and rows are set independently, so a grid can match a portrait-oriented photo without forcing square cells. Square cells only happen when the image itself is square and the column and row counts match.
Does adding a grid change my photo?
The pixels of the photo itself are left alone; the grid is a separate layer of lines drawn on top of a copy at export time. Your original file is never modified or uploaded, only read into the browser tab to build the export.
Why is my exported grid drawing slightly blurry at the edges?
Very large images are downscaled to a working resolution before the canvas draws them, which is listed under the limits above. If your source file is small to begin with, downscaling never happens and the lines are drawn at native pixel positions.
Can I change the line colour and thickness?
Yes, both are controls next to the column and row counts, along with an opacity slider so the grid can sit faintly over a detailed photo instead of covering it.