Foundations

Spacing

Toda a interface é construída sobre uma escala base de 4px. Espaçamentos fora da escala quebram o ritmo visual e não são permitidos.

Spacing Scale

Base 4px, incrementos previsíveis.

4px

8px

12px

16px

20px

24px

32px

40px

48px

64px

Cantos suaves, nunca exagerados.

--radius-none

0px

--radius-sm

4px

--radius-md

6px

--radius-lg

8px

--radius-xl

12px

--radius-2xl

16px

--radius-full

full

Sombras sutis, apenas para separar planos.

--shadow-xs

0 1px 2px rgba(3,9,22,.06)

--shadow-sm

0 1px 3px rgba(3,9,22,.08)

--shadow-md

0 4px 12px rgba(3,9,22,.08)

--shadow-lg

0 12px 32px rgba(3,9,22,.12)

Referências de espaçamento por contexto.