Free · No signup · Files stay local
A grid overlay for drawing on one photo in this browser. Drop a JPG or PNG, set rows and columns, crop if you need to, then download PNG, JPG, or high-res PNG. Nothing uploads.
Drag & drop your reference image here
Supports JPG, PNG, GIF, WEBP
PNG for print. JPG is smaller. High-res PNG is 4× the pixels — one larger file, not four copies.
Features
The first viewport is a drawing overlay: drop one photo, draw even rows and columns, and download PNG or JPG. This URL is not a stock PNG pack, a camera grid, a collage maker, or a CSS layout debugger.
Change rows, columns, color, width, or opacity and the preview updates in this tab. Crop and rotate the photo, then add diagonals or a thirds / golden-ratio overlay. The identity line shows the filename, pixel size, and grid so you know which overlay you are about to save.
Rows and Columns go from 2 to 50 and do not lock together unless you turn on Square cells. A 10×10 overlay is a common portrait setup. For a widescreen photo, crop to 16:9 on this card and set columns higher than rows, or turn Square cells on. Counts above 50 are not offered so the tab stays usable.
The image is opened with FileReader and painted on a canvas in this browser. We do not upload it, we do not store it after you leave, and a weak connection does not block the download. That is the privacy model on this page, not a later setting.
Replace image, Download PNG, Download JPG, and Download 4× PNG sit under the preview. 4× PNG is free here. View enlarges the same canvas on this page. We do not send you to a CDN or a blank tab to see the overlay. PSD, PDF, and a transparent-only line layer are not offered.
What it is
A grid overlay for drawing is even rows and columns on one reference photo so you can copy placement onto paper without guessing. People also type grid overlay, image grid overlay, and grid overlay on photo. This URL is that drawing overlay, not a transparent PNG pack from a stock site, not a live camera viewfinder, and not a CSS layout debugger. You drop a JPG, PNG, GIF, or WEBP, drag Rows and Columns, and the canvas in this tab redraws immediately.
The overlay is the first half of the grid drawing method: lines on the reference. Copying onto paper is the second half, and that tutorial lives on the grid method page. The same card framed as a grid drawing tool lives at grid drawing. Here the job is the overlay itself. Line color, opacity, optional A1 labels, crop, rotate, diagonals, and a thirds or golden-ratio overlay sit on this card. Other sites sell those extras. They are free here. The photo is read with FileReader and never posted to our server.
This page is not Photoshop, GIMP, Illustrator, or Procreate documentation. It is not a Bootstrap or CSS grid overlay extension. It is not Google Maps, Google Earth, a Dungeons and Dragons battle map, an Instagram splitter, a pixel-art chart, or a 1080p overlay PNG. If that is the job you brought, use the tool that actually does it. If you brought one photo and you want even lines for drawing, stay on this card.
How to use
Step 1
Drop a JPG, PNG, GIF, or WEBP on the card, or click to pick one file. PDF and video are not accepted here. You can leave the blank 800×600 canvas if you only need empty squares, but this URL is for an overlay on a photo.
Step 2
The overlay starts at 8×8. Drag Rows for horizontal lines and Columns for vertical lines. Each slider is independent. Crop first if the photo includes extra background. Tune color and opacity so the lines stay visible on a night photo or a white shirt. Labels, diagonals, and composition overlays sit under More options.
Step 3
Confirm the filename and pixel size in the result heading. Download PNG for a print-ready overlay, JPG for a smaller file, or Download 4× PNG when you need a larger print. The lines are painted into that file. Your original camera photo on disk is not rewritten.
Limits
This card is a grid overlay for drawing on one photo. It is not a CSS inspector, not a stock PNG pack, not a camera grid, not GIMP documentation, and not an Instagram collage. The paper-copy tutorial lives on the grid method page. The same overlay framed as a grid drawing tool lives at grid drawing. Searches for add grid to photo land on add grid to photo. Diagonals, thirds, golden ratio, crop, and 4× PNG stay free here.
Why choose
A grid overlay for drawing on one photo in this tab, not a stock PNG, camera grid, collage, or CSS inspector.
People land here from grid overlay for drawing, not from stock PNG packs or camera viewfinders. The card still declines collage layouts, feed splitters, hex cells, pixel-art charts, and CSS inspectors. A sibling page can exist for those jobs; this one puts even lines on one photo you will copy.
Several overlay sites still talk about upload even when the work is local. This page is explicit: FileReader plus canvas, no form post, no account. If you are overlaying a client portrait, that is the reason to stay here instead of a tool that stores files.
You see the overlay on the photo before you save. Identity sits above the buttons so you are not downloading an anonymous file. View enlarges the same canvas on this page. That is faster than exporting blindly and opening the file in another app.
Other grid overlay tools lock diagonals, rule of thirds, golden ratio, and 4× prints behind a subscription. This page gives those controls on the same card, with no account and no trial. The overlay you see on the photo is the overlay you can save.
Limits and tips
Crop first, then tune color and opacity so the lines stay visible on dark and light photos.
Use cases
Artists and teachers who need even lines on one photo they will copy, not a stock overlay PNG.
You have a head-and-shoulders photo and want a 10×10 grid overlay on it before you draw.
Input: One JPG or WEBP portrait already on the phone or laptop.
Setting: Crop to the head, 10 rows by 10 columns, labels on, dark line at about 35 percent opacity.
Output: A PNG of the same photo with a 10×10 overlay you can print or keep on a second screen.
Caveat: This does not correct lens distortion. Use Crop & rotate on this card if you only want the head.
A widescreen reference needs an overlay that follows the photo instead of a square crop.
Input: One landscape JPG or PNG.
Setting: Crop to 16:9 if needed, then set columns higher than rows, or turn on Square cells under More options.
Output: A PNG with the overlay already drawn on the wide photo, ready to print or view.
Caveat: We do not lock the grid to 16 columns by 9 rows unless you set those numbers. Counts stop at 50.
A teacher needs the same grid overlay for a table of students, without making an account for a class set.
Input: One still-life PNG or JPG of the object on the demo table.
Setting: 8×8 overlay, labels on so you can say look at cell C4, medium line width.
Output: One PNG you print in bulk. Every student works from the same squares on the same photo.
Caveat: We do not generate a worksheet pack. You still photocopy or share the PNG yourself.
FAQ
Drop a JPG, PNG, GIF, or WEBP on this card. Drag Rows and Columns until the overlay matches the squares you will copy. Tune color and opacity so the lines stay visible on the photo. Download PNG or JPG. The file is read with FileReader in this tab and is not uploaded.
A grid overlay is even rows and columns drawn on top of one image so you can judge placement without guessing. On this page the overlay is painted on a canvas in the browser, then saved as PNG or JPG with the lines already there. It is not a collage of several photos and it is not a CSS layout debugger.
Click the card or drop one image. The overlay starts at 8×8 and redraws while you drag. Crop first if the background will not be drawn. Then download. This URL is the overlay tool for a single photo, not a feed splitter and not a pixel-art chart.
Set Rows to 10 and Columns to 10. That gives one hundred cells, a common choice for a head-and-shoulders portrait. The sliders are independent from 2 to 50, so you can also run 10 rows by 8 columns on a wide crop. Preview the photo before you save.
People ask for a 16×9 overlay when the photo is widescreen. You can crop to 16:9 on this card, then set columns higher than rows so the cells stay useful, or turn on Square cells under More options. We do not lock the grid to 16 columns by 9 rows unless you set those numbers.
Open this URL in Safari or Chrome on the phone. Pick a photo from the library, drag the sliders, then download. There is no App Store install. Very large photos are capped so the tab stays stable, and the status line says so. The same card works on Android.
This page is not a GIMP tutorial. We do not walk through Filters, Guides, or plugin paths. Drop the photo here, draw the overlay in the browser, and download PNG. You can open that PNG in GIMP later if you want, but the overlay job itself is already finished on this card.
We do not teach Illustrator rectangular grids or Photoshop guides. This is a browser overlay: drop one raster photo, set rows and columns, download. Vector artboards, CSS grid overlays, and Bootstrap inspector extensions are other tools.
This card does not add a Drawing Guide inside Procreate. Download the overlay PNG here, then import that file as a reference or a low-opacity layer in Procreate if you draw on the iPad. The lines are already burned into the download, which is the point of an overlay tool.
This is not a CSS Grid or Bootstrap overlay extension. We do not draw layout columns on a webpage you are building. We draw even squares on one photo so you can copy it onto paper. For frontend layout debugging, use your browser’s inspector.
No. This page does not overlay grids on Google Maps, Google Earth, or a Dungeons and Dragons battle map. Drop a photo you already have. If you need map tiles or a hex campaign grid, that is a different product.
No. A normal desktop or phone browser is enough. There is no Chrome layout-grid extension, no FaceTune overlay, and no store listing. If a result is an APK or an extension page, it is not this URL.
Yes. The overlay, crop, rotate, diagonals, composition guides, and 4× PNG are free on this card. No account, no trial watermark. Other overlay sites hide 4× and guides behind a subscription; those controls stay on this page.
Yes. Download PNG for sharp print edges, JPG for a smaller file, or Download 4× PNG for a larger print. The identity line above the buttons shows the filename, pixel size, and grid count. We do not export PSD, PDF, or a transparent-only line layer.
The download has the overlay painted in. Your original camera file on disk is not rewritten. In this tab you can Replace image or Start over. We do not keep a copy after you leave, because the photo never left the browser.
The card divides the photo into equal rows and equal columns. You do not type pixel gaps. Drag Rows for horizontal lines and Columns for vertical lines. Square cells is optional if you want each cell close to a square. Counts above 50 are not offered.
Lower opacity when you still need to read a face or a busy still life through the overlay. Raise it when you will print the file and copy from paper. Line color sits next to opacity so a night photo can use pale lines and a white shirt can use dark ones. Width is under More options.
Yes, in the mobile browser on the same URL. Pick a photo, drag the sliders, then download. There is no separate iPhone camera-grid app here. The overlay is the same FileReader plus canvas path as desktop.
Artists use it to copy a reference square by square. Teachers print one overlay for a class. You can also check composition with thirds or golden ratio under More options. This page is not for Instagram collages, CSS layout, map tiles, or video overlays. Those jobs need other tools.
No. An overlay is a measuring aid. You still draw every mark. The longer tutorial for how to copy onto paper lives on the grid method page. This URL’s job is to put even lines on the photo and let you download them.
A grid overlay for drawing is even rows and columns on a reference photo so you can copy one square at a time onto paper. This page paints that overlay in the browser and lets you download PNG or JPG. It is not a transparent stock PNG, a camera viewfinder, or a CSS layout debugger.
No. We do not sell or give away a standalone transparent grid PNG to drop into other software. Drop your own photo here, draw the overlay on that photo, and download the combined file. Vecteezy-style overlay packs are a different product.
No. This card does not draw thirds on a live camera feed. It overlays squares on a photo you already have, then you download that file to copy onto paper. If you need a shooting grid in the camera app, use the phone’s built-in guides.
No. Pixel-art and sprite overlays count individual pixels. This page divides one raster photo into even rows and columns for observational drawing. For pixel grids, use a pixel editor. For drawing from a photo, stay on this card.
Drop one image, tune the lines, then download PNG or JPG. This button only scrolls to the card.
Open the drawing overlayYour feedback helps us make Griduna.com better.
Thank you for your feedback
