Generador de Gradientes y Colores Tailwind

Diseña gradientes y sombras de caja visualmente y luego copia las clases de utilidad exactas de Tailwind — sin suposiciones ni búsquedas en la documentación.

Dirección

Color inicial

Usar color intermedio

Color intermedio (opcional)

Color final

Vista previa

Clases Tailwind

Funciona completamente en tu navegador. No se sube nada.

Cómo funciona

STEP 1

Elige tus colores

Selecciona los colores de inicio, paso intermedio y fin usando los selectores de color o escribe cualquier nombre de color de Tailwind.

STEP 2

Ajusta y previsualiza

Establece la dirección, la opacidad y el estilo de sombra. La previsualización en vivo se actualiza al instante.

STEP 3

Copia las clases

Un clic copia la cadena de clases de utilidad de Tailwind lista para pegar en tu portapapeles.