Why the Golden Ratio Works in Design
What is φ (phi)?
φ = 1.6180339887… — an irrational number found throughout nature, architecture, and art. Dividing any dimension by φ gives you its visually harmonious counterpart.
Content + Sidebar Split
The classic 61.8% / 38.2% split. Use it for two-column layouts: the major section carries the primary content, the minor holds navigation or metadata.
Spacing Scale
Each spacing token is φ × the previous. Eliminates arbitrary values — your padding, margin, and gap tokens all relate to each other with mathematical precision.
Typography Scale
Use φ as your type scale ratio: H1 ÷ φ = H2, H2 ÷ φ = H3. This produces a naturally balanced heading hierarchy without manual guesswork.