Surfaces
Er zijn drie niveaus van oppervlakken die worden gebruikt om de UI-hiërarchie te organiseren, vaak gecombineerd met schaduwen. Alle paletkleuren zijn getest om voldoende contrast te bieden tegen deze oppervlakken.
Voorbeeld
.element {
background: var(--dwc-surface-2);
}
Variabelen
Variabele | Gebruik | Voorbeeld |
---|---|---|
--dwc-surface-1 | Het donkerste oppervlak. Gebruikt voor de achtergrond van de body. | |
--dwc-surface-2 | Gebruikt voor componenten (bijv. kaarten). | |
--dwc-surface-3 | Het lichtste en hoogste oppervlak. Gebruikt voor menu's, pop-overs, dialoogvensters ... |