Sistema baseado em múltiplos de 0.25rem (4px).
4xs
0.125rem
2px
Micro ajustes
3xs
0.25rem
4px
Gap ícones e texto
2xs
0.5rem
8px
Padding interno pequeno
xs
0.75rem
12px
Botões compactos
sm
1rem
16px
Padding padrão
md
1.5rem
24px
Cards, modais
lg
2rem
32px
Seções internas
xl
3rem
48px
Espaçamento entre blocos
2xl
4rem
64px
Seções de página
3xl
6rem
96px
Hero sections
4xl
8rem
128px
Grandes seções
p-6 m-4 gap-2 space-y-8
Tokens mapeados automaticamente para os valores acima.