Modular scale
Large scale
The large scale is designed for font-size
, padding
, and margin
. It ranges from $s1
(1rem
) up to $s8
:
Token | Value | Demo |
---|---|---|
$s1 |
1rem |
A |
$s2 |
1.25rem |
A |
$s3 |
1.5625rem |
A |
$s4 |
1.953125rem |
A |
$s5 |
2.44140625rem |
A |
$s6 |
3.0517578125rem |
A |
$s7 |
3.8146972656rem |
A |
$s8 |
4.768371582rem |
A |
Small scale
The small scale is designed for border
, outline
, and smaller (hairline) spaces. It ranges from $ss1
(0.125rem
) to $ss8
(1rem
; equal to $s1
).
Token | Value | Demo |
---|---|---|
$ss1 |
0.125rem | |
$ss2 |
0.25rem | |
$ss3 |
0.375rem | |
$ss4 |
0.5rem | |
$ss5 |
0.625rem | |
$ss6 |
0.75rem | |
$ss7 |
0.875rem | |
$ss8 |
1rem |