Golden Ratio Sizes: A Classic Proportion for Layouts
The golden ratio gives a pleasing imbalance: a larger part and a smaller part that still feel related. This calculator applies it to any number.
What is the Golden Ratio Calculator?
Enter a starting value and the tool shows the larger golden-ratio step up and the smaller step down, plus the classic two-part split of the whole. Use it to size a main column against a sidebar or a headline against supporting text.
How to use it
- Enter a starting value, such as a column width.
- Click Calculate Golden Ratio.
- Use the larger and smaller steps for paired elements.
Worked example
From 100, the larger golden step is 161.8, the smaller step is 61.8, and the whole splits into 61.8 and 38.2.
What is the larger golden-ratio step from 100?
Multiply 100 by 1.618 to get 161.8, and divide by 1.618 to get the smaller step of 61.8.
Frequently asked questions
Is the golden ratio a strict rule?
No, it is a guide. If nearby values look better in your layout, use them.
Where does it help most?
Paired sizes work well: main versus sidebar columns, image versus caption, headline versus body text.