Design

Spacing and layout

Spacing

You should use multiples of 0.25rem (roughly 4px) for spacing.

Contact details

2.25rem

How would you like to receive your certificate of participation.

2rem

3rem

2rem

2.25rem

1rem

3rem

Layout

To create fluid and responsive layouts you should:

  • start with the most constrained environment
  • define how components react as the viewport size changes
  • use plenty white space
  • avoid fixed column grids
Expands to two-thirds/one-third with gutter of 2rem
Centered with maximum width of 28rem and shadow of 0.25rem

View spacing and layout research on GitHub.