Spacing
A set of defined spacing helps with creating consistent user interfaces. For spacing under 48 px a 4 px incrament is used. The spacing is applicable for both horizontal and vertical spacing.
| Token | Value | Example |
|---|---|---|
--r-spacing-025 | 0.25rem | |
--r-spacing-050 | 0.5rem | |
--r-spacing-075 | 0.75rem | |
--r-spacing-100 | 1rem | |
--r-spacing-125 | 1.25rem | |
--r-spacing-150 | 1.5rem | |
--r-spacing-175 | 1.75rem | |
--r-spacing-200 | 2rem | |
--r-spacing-225 | 2.25rem | |
--r-spacing-250 | 2.5rem | |
--r-spacing-275 | 2.75rem | |
--r-spacing-300 | 3rem | |
--r-spacing-350 | 3.5rem | |
--r-spacing-400 | 4rem | |
--r-spacing-450 | 4.5rem | |
--r-spacing-500 | 5rem |