Looking for breakpoints, screen sizes, and grids?
Checkout our Layout documentation!
Checkout our Layout documentation!
Usage
Applying Spacing
- Apply gaps and Padding correctly
- Elements with more spacing around them are perceived as more important because they get more focus on the page, while small spacing makes components look stacked and not stand out.
- You can double the sizes to create bigger spacing.
- Stay consistent with paddings and sizes across different UI components.
- Align all the elements to the exact spacing within the components or a page.
Spacing usage examples
Below you’ll find some common spacing usage examples:
