Surfaces
Il existe trois niveaux de surfaces utilisés pour organiser la hiérarchie de l'interface utilisateur, souvent combinés avec des ombres. Toutes les couleurs de la 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 l'arrière-plan 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, les popovers, les dialogues ... |