Surfaces
Il existe trois niveaux de surfaces utilisés pour organiser la hiérarchie de l'interface utilisateur, souvent combinés avec ombres. Toutes les couleurs de palette sont testées pour fournir un contraste suffisant par rapport à ces surfaces.
Exemple
.element {
background: var(--dwc-surface-2);
}
Variables
Variable | Utilisation | Exemple |
---|---|---|
--dwc-surface-1 | La surface la plus sombre. Utilisée pour le fond du corps. | |
--dwc-surface-2 | Utilisée pour les composants (par exemple, les cartes). | |
--dwc-surface-3 | La surface la plus claire et la plus élevée. Utilisée pour les menus, popovers, dialogues ... |