The rhythm.

One four-pixel base. Eleven steps drive every gap, padding, and margin, so spacing stays consistent and the page keeps an even rhythm.

--space-1 · 4px

0.25rem · Icon-to-label gap

--space-2 · 8px

0.5rem · Tight gap

--space-3 · 12px

0.75rem · Default inline gap

--space-4 · 16px

1rem · Card padding

--space-5 · 20px

1.25rem · Stacked field gap

--space-6 · 24px

1.5rem · Section gap

--space-8 · 32px

2rem · Block separation

--space-10 · 40px

2.5rem · Large block

--space-12 · 48px

3rem · Major section

--space-16 · 64px

4rem · Page rhythm

--space-20 · 80px

5rem · Hero spacing

Rotate your phone for a larger view. Tap the slide to open it full size and zoom.

8.5 × 11 · Portrait