Foundation · Lumina
Moods
Não é dark/light. São quatro paisagens contínuas que o produto atravessa sem corte. O usuário sente a mudança mais do que vê.
As quatro paisagens
Cada mood é um conjunto coerente de luz, temperatura e densidade. Toque ou passe o cursor para experimentar.
auto-morphpausado
Como funciona
Cada mood é um conjunto de CSS vars semânticas (background, foreground, primary, muted...). O body anima a transição em 480 ms com cubic-bezier(0.4, 0, 0.2, 1).
TypeScript
Princípio
Moods, não modos.
Modo é binário. Mood é paisagem.
Em vez de pedir ao usuário um interruptor, oferecemos uma narrativa contínua, que se ajusta ao contexto e à hora.