Toolipedia Insertar
ES
← Todas las herramientas de texto

Generador de escala de sombras

Crea un conjunto de sombras de caja a juego (niveles de elevación) como variables CSS.

  • Gratis
  • Sin registro
  • Funciona en cualquier dispositivo

Acerca de Generador de escala de sombras

Los sistemas de diseño usan un conjunto de niveles de elevación en lugar de sombras aleatorias. Esta herramienta crea valores box-shadow a juego, de pequeños a grandes, con un ángulo, un crecimiento del desenfoque y una opacidad coherentes, y los entrega como propiedades personalizadas de CSS como --shadow-sm y --shadow-lg para que tarjetas, menús y modales se mantengan coherentes.

Cómo usar Generador de escala de sombras

  1. Elige un color de sombra, una intensidad base y un número de niveles.
  2. Previsualiza los niveles de elevación en tarjetas de muestra.
  3. Copia las variables CSS en tu hoja de estilos.

¿Por qué usar esta herramienta?

También conocida como

Preguntas frecuentes

¿Por qué usar sombras en capas en lugar de una sola?

Varias sombras suaves apiladas con desenfoque creciente se ven más naturales que una sola sombra intensa, porque la luz real produce tanto una sombra de contacto nítida como una ambiental amplia.

¿Cuántos niveles de sombra necesito?

La mayoría de las interfaces funcionan bien con cuatro a seis niveles, desde pequeño para botones hasta grande para cuadros de diálogo. Más que eso es difícil de distinguir para las personas.

¿De qué color deben ser las sombras?

Un tinte oscuro semitransparente de tu color de fondo se ve más natural que el negro puro. En temas oscuros las sombras se ven menos, así que prueba con algo más de intensidad.

¿Es gratis Generador de escala de sombras?

Sí. Generador de escala de sombras de Toolipedia es de uso gratuito, sin registro y sin marca de agua.

¿Es seguro usarlo?

Sí. Todo se calcula en tu navegador y nada de lo que introduces se envía a nuestro servidor.

¿Funciona en mi teléfono?

Sí. Funciona en cualquier navegador moderno en Android y iPhone, y también en tabletas y computadoras. No hay que instalar nada.

¿Necesito una cuenta?

No. Solo abre la página y usa la herramienta. No hace falta registrarse ni dar un correo electrónico.

¿Puedo poner Generador de escala de sombras en mi propio sitio web?

Sí. Usa el botón «Insertar en tu sitio» debajo de la herramienta para copiar un fragmento corto de código y pegarlo en tu página. Es gratis, no necesita cuenta y la herramienta sigue funcionando dentro de tu página.

Herramientas relacionadas