OneTaskBy Tim King · Updated
Rule of Thirds Overlay
Golden Spiral & Composition Grid on Your Photo
OneTask is free, with no sign-up, and built by one person.
If this tool saved you time, a coffee helps keep new ones coming.
How the Rule Of Thirds Overlay works
This rule of thirds overlay checks a photo's composition. Drop a photo on the page and see at once how it sits against the classic composition guides: the rule-of-thirds grid, the tighter golden ratio grid, the golden spiral, golden triangles, the diagonals and the centre lines. Move the spiral to whichever corner your subject sits in, pick a line colour that shows against the image, and draw on top to mark what you would crop or where the eye travels. The download is at the photo's own resolution with the guides and notes burned in, and the photo never leaves your browser.
Rule of thirds overlay: the overlays
The rule of thirds divides the frame into nine equal parts; placing a subject on one of the four intersections, or a horizon on one of the two horizontal lines, is the first composition rule most photographers learn. The golden ratio grid, sometimes called the phi grid, puts the lines at 38.2 and 61.8 percent instead of 33.3 and 66.7, so the centre band is narrower and the intersections sit closer to the middle. The golden spiral, or Fibonacci spiral, is the curve that winds through a golden rectangle divided into ever smaller squares; the eye of the spiral marks where the strongest point of interest should sit and the sweep suggests the path the viewer's gaze takes. Golden triangles draw one diagonal and drop perpendiculars to it from the other two corners, which suits diagonal subjects such as roads, rivers and reclining figures. Diagonals and centre lines are there for symmetry and for checking a horizon is level.
Fitting the spiral to your frame
A true golden spiral fits a golden rectangle, which is roughly 1.618:1, while photos are usually 3:2, 4:3 or 16:9. This page stretches the spiral to the frame so the eye still lands at the golden point and the squares still divide the sides in golden proportion; the quarter arcs become slightly elliptical, which is what camera and editing apps do too. The corner control moves the eye of the spiral to whichever quadrant holds your subject, mirroring the curve as needed, and also flips which diagonal the golden triangles use.
Drawing on the photo
The pen draws in the overlay colour at twice the line width, so you can circle the subject, sketch a proposed crop or trace the path of a leading line. Undo removes the last mark and Clear removes all of them while leaving the photo and the overlay in place. Dropping a new photo clears the marks.
Full-resolution download
Download PNG renders the photo at its native pixel size with the guide lines and any marks scaled to match, so a 6000 by 4000 pixel image comes back at 6000 by 4000 with lines the same relative thickness you saw on screen. Download SVG embeds the original photo file and writes the guides and marks as vector paths on top, so you can delete or recolour them later in a vector editor and recover the untouched image beneath.
FAQ
Should I use the rule of thirds or the golden ratio?
They are close cousins and both work. The rule of thirds is simpler and a little more generous in where it puts the subject; the golden ratio pulls the subject nearer the centre and tends to feel calmer. Try both overlays on the same photo and keep whichever makes the existing composition look intentional.
Does the overlay change my photo?
Not until you download it. The overlay is drawn on a layer above the image in your browser. The PNG download bakes the lines and marks into a copy of the photo; the original file on your computer is untouched, and the SVG keeps the photo as a separate embedded image with the lines as editable paths above it.
Why is the golden spiral not a perfect circle arc?
Because your photo is not a golden rectangle. The spiral is scaled to the frame so that its eye and its dividing lines land at the golden proportions of your actual image, and that stretches the arcs slightly. A 3:2 photo is close enough that the difference is barely visible; a 16:9 frame shows it more.
Can I use this to crop the photo?
Not directly, but it is the right place to decide the crop. Draw the crop you want with the pen, download the annotated PNG as a reference, then make the actual crop in an editor. The aspect ratio cropper on this site will cut to a fixed ratio once you know where you want the edges to fall.
See also: all Drawing Pads tools, Images, Audio, Video & Screen, PDF, SVG, Simulations & Screensavers, Generative Art, Chart Makers, 3D Model Viewers, Mockups & 3D Making, Diagram Makers, 3D Science, Tracker Music.
Related tools
Aspect Ratio Cropper
Crop to a standard ratio without shrinking the picture.
Image Dimensions Inspector
Pixel size, aspect ratio, megapixels and CSS size for any image.
Online Whiteboard
Draw on a plain, grid or lined board; download PNG or SVG.
Doodle Pad
Doodle with pen, marker, rainbow or calligraphy brushes; download PNG or SVG.
Image Resizer
Resize to a width, height or percent with the aspect ratio locked.