Font Sizing Responsive
|
Extra small <544px |
Small ≥544px |
Medium ≥768px |
Large ≥992px |
Extra large ≥1200px |
|
|---|---|---|---|---|---|
| 11px |
font-xs-1
|
font-sm-1
|
font-md-1
|
font-lg-1
|
font-xl-1
|
| 12.5px |
font-xs-2
|
font-sm-2
|
font-md-2
|
font-lg-2
|
font-xl-2
|
| 14px |
font-xs-3
|
font-sm-3
|
font-md-3
|
font-lg-3
|
font-xl-3
|
| 18px |
font-xs-4
|
font-sm-4
|
font-md-4
|
font-lg-4
|
font-xl-4
|
| 22px |
font-xs-5
|
font-sm-5
|
font-md-5
|
font-lg-5
|
font-xl-5
|
| 26px |
font-xs-6
|
font-sm-6
|
font-md-6
|
font-lg-6
|
font-xl-6
|
| 32px |
font-xs-7
|
font-sm-7
|
font-md-7
|
font-lg-7
|
font-xl-7
|
| 48px |
font-xs-8
|
font-sm-8
|
font-md-8
|
font-lg-8
|
font-xl-8
|
| 56px |
font-xs-9
|
font-sm-9
|
font-md-9
|
font-lg-9
|
font-xl-9
|
| 72px |
font-xs-10
|
font-sm-10
|
font-md-10
|
font-lg-10
|
font-xl-10
|
| 96px |
font-xs-11
|
font-sm-11
|
font-md-11
|
font-lg-11
|
font-xl-11
|
| 124px |
font-xs-12
|
font-sm-12
|
font-md-12
|
font-lg-12
|
font-xl-12
|
Font Weight
| CSS | Font Primary | Font Secondary | Font Tertiary | |
|---|---|---|---|---|
| 100 |
font-ultralight
|
font-ultralight | font-ultralight | font-ultralight |
| 200 |
font-extralight
|
font-extralight | font-extralight | font-extralight |
| 300 |
font-light
|
font-light | font-light | font-light |
| 400 |
font-regular
|
font-regular | font-regular | font-regular |
| 500 |
font-medium
|
font-medium | font-medium | font-medium |
| 600 |
font-semibold
|
font-semibold | font-semibold | font-semibold |
| 700 |
font-bold
|
font-bold | font-bold | font-bold |
| 800 |
font-extrabold
|
font-extrabold | font-extrabold | font-extrabold |
| 900 |
font-ultrabold
|
font-ultrabold | font-ultrabold | font-ultrabold |
Font Spacing
| CSS | Font Primary | |
|---|---|---|
| -0.07em |
space-xs
|
font spacing |
| -0.03em |
space-sm
|
font spacing |
| 0em |
space-md
|
font spacing |
| 0.03em |
space-lg
|
font spacing |
| 0.1em |
space-xl
|
font spacing |
