Foundation

Spacing + grid + radius

Rhythm and shape

RequiredVisual system
ContractSpacing + grid + radius
Job
Rhythm and shape
Requirement
must specify
States / rules
Spacing scale; content width; radius scale + round-vs-sharp rule
Specified means
Scale numbers and a shape rule
Hardest context
Dense list next to a hero card
Example

8-step space + radius.md for cards

Counter-example

Random rounded-xl per page

How this lives in Building Blocks

Representation: Shared foundation / token / behavior guidance.

Building Blocks should provide shared guidance, semantic roles, examples, and reusable implementation hooks where appropriate. Each product maps those roles to its own theme and documents any justified exceptions.

Do not specify the easy case only.

The source checklist’s hardest-context test is part of what “specified” means: Dense list next to a hero card.

On-spec signal

8-step space + radius.md for cards

Failure signal

Random rounded-xl per page

Catalog connection

The product-local Catalog should show this row’s actual state for that product using the Catalog contract. Building Blocks documentation can define the baseline, but it does not make a product’s row Specified, Designed, or In code by itself.

See the Catalog contract →