Shadows
Las propiedades de sombra se utilizan para agregar efectos de sombra alrededor del marco de un elemento. Puedes establecer múltiples efectos separados por comas. En la mayoría de los casos, las sombras se utilizan para significar elementos que están superpuestos en la interfaz de usuario.
Ejemplo
.element {
box-shadow: var(--dwc-shadow-xl);
}
Color de Sombra
Controlas el color de la sombra estableciendo la variable --dwc-shadow-color. Por defecto, el color de la sombra es gris tintado con el color primario.
Variables
| Variable | Ejemplo |
|---|---|
--dwc-shadow-xs | |
--dwc-shadow-s | |
--dwc-shadow-m | |
--dwc-shadow-l | |
--dwc-shadow-xl | |
--dwc-shadow-2xl | |
--dwc-shadow |