Generador de Degradados
Crea degradados CSS y Tailwind con un editor visual intuitivo
Tipo
Ángulo
135°Presets
Colores
.element {
background: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);
}linear-gradient(135deg, #6366f1 0%, #ec4899 100%)Preguntas Frecuentes
¿Cuál es la diferencia entre degradados lineales, radiales y cónicos?
Los degradados lineales transicionan colores a lo largo de una línea recta. Los degradados radiales irradian desde un punto central hacia afuera. Los degradados cónicos rotan los colores alrededor de un punto central, como una rueda de color.
¿Cómo uso el degradado en Tailwind CSS?
Cambia a la pestaña Tailwind y copia los nombres de clase generados. Pégalos directamente en cualquier proyecto Tailwind — no se necesita configuración adicional para los colores estándar.
¿Puedo añadir más de dos paradas de color?
Sí — haz clic en 'Agregar Color' para añadir tantas paradas como desees, luego arrastra o escribe posiciones exactas para controlar con precisión dónde aparece cada color en el degradado.
¿Puedo usar el degradado en React u otros frameworks?
Por supuesto. El código CSS funciona en cualquier lugar donde puedas aplicar estilos, incluyendo estilos en línea de React, Vue, Svelte, HTML plano o cualquier hoja de estilos CSS.