Skip to content
veraq

FOUNDATIONS · 06

A 4px step, and the calm it carries.

Spacing is a 4px base step. Components are generous, never cramped, and density is a deliberate setting. The scale runs from a reset to page-scale separation; every gap and pad reads one of these tokens — never an in-between value.

01

The scale

  • space-00px
    reset
  • space-14px
    icon-to-label, chip padding
  • space-28px
    tight stack, input inner padding
  • space-312px
    control padding, list-row gaps
  • space-416px
    card inner padding (mobile), default stack gap
  • space-524px
    card inner padding (desktop), section gap
  • space-632px
    between cards
  • space-740px
    between page sections
  • space-848px
    hero / lit-module breathing room
  • space-964px
    marketing section rhythm (DEEP)
  • space-1096px
    major marketing band
  • space-11128px
    full-bleed module gap
  • space-12192px
    page-scale separation
02

The rule

Pad with even steps (2 / 4 / 6); separate sections with the larger steps (7 / 8 / 9). Never invent an in-between value — if two steps feel wrong, the layout is, not the scale.