Binatomy
Tipografia

Generatore Scala Tipografica

Genera scale tipografiche proporzionali per design system e CSS

Anteprima scala

xs
9px / 0.5628rem
The quick brown fox
sm
12px / 0.7502rem
The quick brown fox
base
16px / 1rem
The quick brown fox
lg
21.33px / 1.333rem
The quick brown fox
xl
28.43px / 1.7769rem
The quick brown fox
2xl
37.9px / 2.3686rem
The quick brown fox
3xl
50.52px / 3.1573rem
The quick brown fox
4xl
67.34px / 4.2087rem
The quick brown fox
5xl
89.76px / 5.6102rem
The quick brown fox
6xl
119.66px / 7.4784rem
The quick brown fox

Codice

:root {
  --text-xs: 0.5628rem; /* 9px */
  --text-sm: 0.7502rem; /* 12px */
  --text-base: 1rem; /* 16px */
  --text-lg: 1.333rem; /* 21.33px */
  --text-xl: 1.7769rem; /* 28.43px */
  --text-2xl: 2.3686rem; /* 37.9px */
  --text-3xl: 3.1573rem; /* 50.52px */
  --text-4xl: 4.2087rem; /* 67.34px */
  --text-5xl: 5.6102rem; /* 89.76px */
  --text-6xl: 7.4784rem; /* 119.66px */
}
FAQ

Domande Frequenti

Tutto sulla tipografia e le scale modulari