Tipo de objeto BoxShadowValue
Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →
El objeto BoxShadowValue es utilizado por la propiedad de estilo boxShadow. Se compone de 2-4 valores de longitud, un color opcional y un booleano opcional inset. Estos valores definen colectivamente el color, posición, tamaño y difuminación de la sombra.
Ejemplo
{
offsetX: 10,
offsetY: -3,
blurRadius: '15px',
spreadDistance: '10px',
color: 'red',
inset: true,
}
Claves y valores
offsetX
El desplazamiento en el eje X. Puede ser positivo o negativo. Un valor positivo indica derecha y uno negativo indica izquierda.
| Type | Optional |
|---|---|
| number | string | No |
offsetY
El desplazamiento en el eje Y. Puede ser positivo o negativo. Un valor positivo indica arriba y uno negativo indica abajo.
| Type | Optional |
|---|---|
| number | string | No |
blurRadius
Representa el radio utilizado en el algoritmo de desenfoque gaussiano. Cuanto mayor sea el valor, más difuminada aparecerá la sombra. Solo son válidos los valores no negativos. El valor predeterminado es 0.
| Type | Optional |
|---|---|
| number | string | Yes |
spreadDistance
Define cuánto crece o se reduce la sombra. Un valor positivo hará que la sombra crezca, mientras que uno negativo la reducirá.
| Type | Optional |
|---|---|
| number | string | Yes |
color
El color de la sombra. El valor predeterminado es black.
| Type | Optional |
|---|---|
| color | Yes |
inset
Indica si la sombra es interior o no. Las sombras interiores aparecen dentro del borde del elemento, en contraste con las exteriores.
| Type | Optional |
|---|---|
| boolean | Yes |