Fundação

Elevação

No DiSco, elevação é expressa com cor de superfície, não com sombra. Quanto mais claro o fundo, mais elevado o elemento.

Nível 0 · #0f0f0f bg-[#0f0f0f]. Fundo da aplicação
Nível 1 · #1a1a1a bg-[#1a1a1a]. Cards, inputs, bottom sheets
Nível 2 · #2a2a2a bg-[#2a2a2a]. Hover, bordas, separadores
Nível 3 · #333333 bg-[#333]. Drag handles, elementos sobre cards

Por que não sombra?

  • Sombras escuras são invisíveis em temas dark. A variação de cor de superfície cria hierarquia de forma confiável em qualquer brilho de tela.
  • Não crie valores intermediários além dos 4 níveis definidos. Se precisar de mais contraste, use borda border-[#2a2a2a].