Golden Ratio Calculator
Calculate golden ratio proportions for free — enter a total, a longer side or a shorter side and get the matching values (φ ≈ 1.618) for layouts, grids, logos and crops, with a golden rectangle and spiral diagram. The typography section turns your body font size into an ideal line height, line width and a golden type scale with copy-ready CSS.
100% private — everything runs in your browser. Conversion happens on your device; nothing is uploaded.
Golden ratio typography
φ (phi) ≈ 1.6180339887. Click any result to copy it. The typography section follows the golden-ratio typography method: line height = font size × φ, adjusted for line width, and a type scale in half-steps of φ.
How to use the golden ratio
- Enter a known value — the total, the longer side or the shorter side.
- Read the matching golden-ratio values (click to copy).
- Use the spiral diagram for composition.
- Set your body font size to get golden typography and CSS.
What you can use it for
- Split page layouts into golden columns (e.g. content + sidebar)
- Size logos, cards and image crops pleasingly
- Build a harmonious type scale
- Plan photo compositions with the golden spiral
More free tools
Building for the web?
Format, minify, convert and generate code with our free, private developer tools.
See all free tools →Frequently asked questions
What is the golden ratio?
About 1.618 (φ). Two quantities are in the golden ratio when the larger divided by the smaller equals the whole divided by the larger.
How do I split a 960 px layout?
Enter 960 as the total: the main column is about 593 px and the sidebar about 367 px.
How is the line height calculated?
With golden-ratio typography: line height ≈ font size × 1.618, adjusted slightly for your line width. For 16 px text that's about 26 px.
Is the golden ratio always best?
It's a useful starting point, not a rule. Use it alongside your content and brand needs.