Spacing

# Guidelines

The Cedar spacing system is based on 16px units. The scaling system uses fractions and multiples of the base size (16px). The result is easy to understand. Please note that 1 rem equals 10 pixels.


System scale Pixel values Rem values
1/8 space 2px 0.2rem
1/4 space 4px 0.4rem
1/2 space 8px 0.8rem
3/4 space 12px 1.2rem
1 space 16px 1.6rem
1 1/2 spaces 24px 2.4rem
2 spaces 32px 3.2rem
4 spaces 64px 6.4rem

For more information about using Cedar's spacing system and layout usage guidance, visit the Spacing article.