Spacing

Intentional spacing adds uniformity and rhythm to visual design, creating a more predictable and serviceable experience for users.

Applying Space Values

Spacing tokens make it easy to configure a component's padding, margin, or position. Instead of setting these properties in pixels or rems, using spacing tokens ensures consistency and minimizes mistakes.

Spacing Tokens

Matchbox operates on a 4px baseline scale where each token variant is a multiple of the baseline; spacing larger than the 800 token is a multiple of 16px.