Las sombras de cuadro agregan profundidad a los elementos de la interfaz de usuario al simular iluminación y elevación. Las sombras bien diseñadas crean una jerarquía visual y hacen que las interfaces parezcan más táctiles.
Ajuste el desplazamiento horizontal, el desplazamiento vertical, el desenfoque, la extensión, el color y la opacidad. La vista previa de Canvas se actualiza en tiempo real. Copie el código CSS cuando esté satisfecho.
Frequently Asked Questions
Q: ¿Cuál es la diferencia entre desenfoque y extensión?
¿Cuál es la diferencia entre desenfoque y extensión? El desenfoque controla qué tan suave es el borde de la sombra. La extensión controla cuánto se expande la sombra.
Q: ¿Cuántas capas de sombras debo usar?
¿Cuántas capas de sombras debo usar? Por lo general, 1 o 2 capas son suficientes. Utilice sombras insertadas para darle profundidad interior.
Q: ¿Cuántas capas de sombra de cuadro debo usar?
¿Cuántas capas de sombra de cuadro debo usar? Los diseños profesionales suelen utilizar de 2 a 4 capas para aumentar la profundidad. Comience con una sombra pequeña y densa, agregue una sombra de extensión media y, opcionalmente, agregue una sombra ambiental grande. La herramienta admite capas ilimitadas.
Q: ¿Cuál es el impacto en el rendimiento de box-shadow?
¿Cuál es el impacto en el rendimiento de box-shadow? Algunas sombras de cuadros tienen un impacto insignificante. Demasiadas sombras muy borrosas pueden afectar el rendimiento del desplazamiento en dispositivos de gama baja. La herramienta muestra una vista previa en tiempo real para que puedas juzgar antes de copiar.
Q: ¿Puedo crear sombras interiores (recuadro)?
¿Puedo crear sombras interiores (recuadro)? La versión actual se centra en las sombras exteriores. Para sombras interiores, agregue manualmente la palabra clave "inset" al comienzo del valor de sombra del cuadro CSS generado.
Colores del Mundo Hispano
Del añil guatemalteco al rosa mexicano, el mundo hispanohablante tiene una rica tradición cromática. Estos colores nacen de textiles indígenas, arquitectura colonial y festividades, y hoy inspiran paletas llenas de carácter.
Rosa Mexicano #E4007CColor icónico del diseño mexicano, creado por Ramón Valdiosera
Azul Añil #4B0082Tinte tradicional de los textiles mayas de Guatemala
Rojo Bermellón #E34234El rojo intenso de los toros y la cerámica española
Amarillo Maíz #F4B41AEl oro del maíz, base de la alimentación mesoamericana
Verde Jade #00A86BLa piedra sagrada de mayas y aztecas
Azul Celeste #A5C8E1El azul de la bandera argentina y el cielo porteño
Terracota #E2725BArcilla cocida — el color de los tejados coloniales
Vino Tinto #722F37El burdeos de las bodegas de La Rioja
Oro Colonial #D4AF37El dorado de los retablos barrocos americanos
Turquesa Caribe #40E0D0El color de las playas del Caribe
Q: ¿Qué es el rosa mexicano?
¿Qué es el rosa mexicano? El rosa mexicano (#E4007C) es un color vibrante promovido por el diseñador Ramón Valdiosera en los años 40 como símbolo de identidad nacional, usado hoy en artesanías, textiles y diseño contemporáneo.
Q: ¿Qué es el azul añil?
¿Qué es el azul añil? El añil es un tinte natural azul extraído de la planta del índigo, usado en los textiles mayas de Guatemala y en los huipiles tradicionales desde tiempos prehispánicos.