Font Weight
| Atomic Props | CSS Properties |
|---|---|
| fontHairline | font-weight: 100; |
| fontThin | font-weight: 200; |
| fontLight | font-weight: 300; |
| fontNormal | font-weight: 400; |
| fontMedium | font-weight: 500; |
| fontSemibold | font-weight: 600; |
| fontBold | font-weight: 700; |
| fontExtrabold | font-weight: 800; |
| fontWeight-{value} / fontWeight={value} | font-weight: {value}; |
Usage
There are two ways to control the font weight, one is to use a preset value, and the other is to use a precise value.
Use preset value
Result
Loading...
Live Editor
Use precise value
Result
Loading...
Live Editor