Pular para o conteúdo principal

Espaçamento​

A consistência no uso de espaçamento é essencial no design de interfaces.
Ela impacta diretamente a legibilidade, escaneabilidade, navegação e hierarquia visual, ajudando os usuários a entenderem a relação entre elementos e a estrutura do layout.

Dimensões Globais​

Os tokens de dimensão globais padronizam valores aplicados em diferentes componentes da interface.
Eles servem como referência para espaçamento, tamanhos de elementos, larguras, alturas e outras propriedades dimensionais em todo o sistema.

Tabela de dimensões globais

Gap​

O gap define o espaço entre elementos da interface (horizontal ou vertical).
Ele garante separação visual clara, organiza hierarquicamente os conteúdos e facilita a leitura e interação do usuário.

Tabela de gap

Padding​

O padding é o espaço interno entre o conteúdo de um elemento e suas bordas.
Exemplo: a distância entre o rótulo de um botão e suas bordas.
Esse espaçamento interno melhora a legibilidade sem alterar o tamanho total do elemento.

Tabela de padding