Cores
Índigo de tinta para as ações, lacre para selos e certificados, neutros com leve tom de papel. As amostras abaixo leem o CSS do tema e mudam junto com o tema escuro.
Fundos
Superfícies, ações e status.
Neutros
bg-canvas
bg-surface
bg-elevated
bg-dialog
bg-subtle
bg-muted
bg-muted-hover
bg-disabled
bg-inverse
bg-input
bg-scrim
bg-secondary
bg-secondary-hover
Primária
bg-primary
bg-primary-hover
bg-primary-subtle
bg-primary-subtle-hover
Informação
bg-info
bg-info-hover
bg-info-subtle
bg-info-subtle-hover
Destaque
bg-accent
bg-accent-hover
bg-accent-subtle
Perigo
bg-danger
bg-danger-hover
bg-danger-subtle
bg-danger-subtle-hover
Aviso
bg-warning
bg-warning-hover
bg-warning-subtle
bg-warning-subtle-hover
Atenção
bg-caution
bg-caution-hover
bg-caution-subtle
bg-caution-subtle-hover
Sucesso
bg-success
bg-success-hover
bg-success-subtle
bg-success-subtle-hover
Texto e ícones
fg-strong é o texto padrão. on-* é o texto sobre cor sólida.
Neutros
fg-strong
fg-main
fg-muted
fg-subtle
fg-disabled
fg-on-inverse
Primária
fg-primary
fg-on-primary
Informação
fg-info
fg-on-info
Destaque
fg-accent
fg-on-accent
Perigo
fg-danger
fg-on-danger
Aviso
fg-warning
fg-on-warning
Atenção
fg-caution
fg-on-caution
Sucesso
fg-success
fg-on-success
Bordas
border-input para campos e border-accent para selos.
Neutros
border
border-muted
border-moderate
border-strong
border-input
Primária
border-primary
border-primary-muted
Informação
border-info
Destaque
border-accent
Perigo
border-danger
Aviso
border-warning
Atenção
border-caution
Sucesso
border-success
Foco
ring-focus é sólido e vai no outline. ring-primary é o halo translúcido do shadcn.
Primária
ring-focus
ring-primary
Informação
ring-info
Perigo
ring-danger
Aviso
ring-warning
Atenção
ring-caution
Sucesso
ring-success
Documento
A mesa, o papel, a tinta e o hash.
Neutros
doc-desk
doc-paper
doc-edge
doc-hash
Primária
doc-ink
Status do envelope
Sete estados, cada um com texto, fundo e borda.
Neutros
status-draft
status-draft-subtle
status-draft-edge
status-canceled
status-canceled-subtle
status-canceled-edge
Informação
status-sent
status-sent-subtle
status-sent-edge
Perigo
status-rejected
status-rejected-subtle
status-rejected-edge
Aviso
status-partial
status-partial-subtle
status-partial-edge
Atenção
status-expired
status-expired-subtle
status-expired-edge
Sucesso
status-completed
status-completed-subtle
status-completed-edge
Signatários
Uma cor por signatário, repetida no avatar e nos campos do PDF.
signer-on
signer-1
signer-2
signer-3
signer-4
signer-5
signer-6
signer-7
signer-8
Escalas primitivas
Valores crus, agrupados pelo matiz. Componente nunca usa estas classes diretamente.
Azuis e índigo
info
blue
brand
Rosas e vermelhos
accent
cherry
crimson
danger
Laranjas e amarelos
orange
warning
caution
Verdes
forest
success
emerald
Neutros
neutral
clay
sand
moss
mauve
sage
slate