Skip to content

Spacing and sizing draft v0.2.0

The spacing scale and the element sizes from the Figma library, which components pick their paddings, gaps, heights and icon sizes from.

Two scales from the Figma library (Dimension), as they are, measure everything: space, the room inside and between elements, on a 4 px grid; and size, the dimensions of elements such as icons and avatars. Components and the docs site read them directly: each component picks its padding, gaps, heights and icon sizes from them in its own tokens. There is no semantic spacing layer in between.

Decisions

From decisions in packages/components/specs/foundations/spacing.spec.json, newest first. Every active decision is implemented by the spec, the semantic tokens and the components following the foundation.

No decision recorded yet.