Pick a spacing scale and use it for layout — not per-screen "a bit tighter" — so density is a decision you can repeat. Use when screens look inconsistent, when you are starting a UI kit, or when type and colour already exist but the layout still feels arbitrary.
--- name: build-a-spacing-system category: design description: >- Pick a spacing scale and use it for layout — not per-screen "a bit tighter" — so density is a decision you can repeat. Use when screens look inconsistent, when you are starting a UI kit, or when type and colour already exist but the layout still feels arbitrary. --- # Build a Spacing System Colour and type get named. Space gets a magic number per screen. That is why a product can have a beautiful type scale and still look like four products in a trench coat. A spacing system is a **short scale of tokens**, used for gaps and padding, so "how far is this from that" is a choice from a list, not a feeling. ## Pick a scale, then stop inventing
You are reading the opening of this skill.
The rest is open to any signed-in account — free included. Reading the library costs nothing.
Shared publicly by the author and open for any use. See the Terms.