Generador de degradados
Construir gradientes CSS con salida copiable
Paradas de color
CSS
Acerca del Generador de Gradientes CSS
Este generador de gradientes crea gradientes lineales y radiales de CSS visualmente. Elige tu tipo de gradiente, ángulo y paradas de color, luego copia la regla CSS lista para usar. Admite múltiples paradas de color y vista previa en tiempo real para que veas exactamente cómo se verá el gradiente antes de usarlo.
Los gradientes se utilizan ampliamente en el diseño web moderno para fondos, botones, secciones hero y superposiciones en imágenes. Esta herramienta ahorra tiempo generando automáticamente la sintaxis CSS compatible con navegadores — sin necesidad de recordar la sintaxis exacta del gradiente o calcular manualmente los porcentajes de las paradas de color.
Preguntas frecuentes
¿Lineal o radial — cuándo usar cada uno?
Los gradientes lineales crean una sensación de dirección de luz y son excelentes para fondos, encabezados y botones. Los gradientes radiales sugieren un punto focal o profundidad, útiles para focos, viñetas y elementos decorativos.
¿Puedo añadir más de dos paradas de color?
Sí. Los gradientes con múltiples paradas te permiten crear arco iris, atardeceres y transiciones más matizadas. Las paradas se pueden colocar en cualquier porcentaje a lo largo de la línea de gradiente — no solo en los extremos.