{# canonical_base is the OWNING tenant's origin: all 16 Peasy domains serve the same catalogue, so a page rendered by a non-owner points its canonical at the owner instead of competing with it. Falls back to this site for static/self-owned pages. #}
🍋
Menu
Design

Golden Ratio

The mathematical ratio (~1.618:1) found in nature and used in design to create aesthetically pleasing proportions.

Détail technique

The golden ratio (phi, approximately 1.6180339887) appears in design as the ratio of consecutive Fibonacci numbers (1, 1, 2, 3, 5, 8, 13...). In layout, it suggests dividing space at approximately 62:38. In typography, multiplying a base font size by 1.618 produces harmonious scale progressions (e.g. 16px → 26px → 42px). While its prevalence in nature is often overstated, it provides a reliable starting point for proportional relationships in grid systems and whitespace allocation.

Exemple

```css
/* Golden ratio typography scale */
:root {
  --phi: 1.618;
  --text-sm:  0.875rem;               /* 14px */
  --text-base: 1rem;                   /* 16px */
  --text-lg:  calc(1rem * var(--phi));  /* 25.9px */
  --text-xl:  calc(1rem * var(--phi) * var(--phi)); /* 41.9px */
}

/* Golden ratio layout: 62% / 38% split */
.layout { grid-template-columns: 1.618fr 1fr; }
```

Outils associés

Termes associés