Generador/analizador de Box Shadow CSS
Opciones
Estado
inactivo
capas
1
Vista previa en vivo
Preview card
Your box-shadow appears here
Acerca del generador/analizador de Box Shadow CSS
Esta herramienta le ayuda a crear valores de `box-shadow` CSS de forma visual y a analizar cadenas `box-shadow` existentes.
Es útil para el diseño de UI, depuración de CSS, sistemas de diseño y experimentación rápida con sombras.
Cómo utilizar la herramienta
- Introduzca valores de offset, blur, spread, color e `inset` para generar una sombra.
- O pegue una cadena `box-shadow` existente en el campo de entrada y haga clic en Analizar.
- Revise la vista previa en vivo.
- Copie el valor CSS generado cuando se vea bien.
Consejos
- Los valores de desenfoque más grandes crean sombras más suaves.
- La dispersión negativa puede hacer que las sombras parezcan más definidas.
- Las sombras insertadas son útiles para elementos de la interfaz de usuario presionados o empotrados.
- Los colores RGBA son ideales cuando quieres sombras suaves y transparentes.
Herramientas relacionadas
Estas herramientas también pueden resultarle útiles.
Convertidor de colores
Convierta colores HEX, RGB, RGBA y HSL instantáneamente en su navegador.
Utilidades varias
›
Codificador/decodificador de entidades HTML
Codifique y decodifique entidades HTML instantáneamente en su navegador.
Codificación y seguridad
›
Vista previa de Markdown
Obtenga una vista previa de Markdown y copie el HTML renderizado al instante.
Texto y contenido
›
Metaetiquetas/Vista previa de gráfico abierto
Obtenga una vista previa de fragmentos de Google y Open Graph y genere metaetiquetas.
SEO y webmaster
›
Preguntas frecuentes sobre el generador de sombras de cajas
¿Qué es la sombra de cuadro CSS?
Box-shadow es una propiedad CSS que se utiliza para agregar efectos de sombra alrededor del marco de un elemento.
¿Puede esta herramienta analizar los valores de sombra de cuadro existentes?
Sí. Pegue una cadena de sombra de cuadro y la herramienta intentará extraer sus partes.
¿Admite sombras insertadas?
Sí. Puede generar y analizar sombras insertadas.
¿Puedo usar colores rgba?
Sí. RGBA funciona bien para sombras de interfaz de usuario más suaves y realistas.