Herramienta Gratuita
CSS Gradient Generator
Construye degradados CSS lineales, radiales y cónicos visualmente. Arrastra paradas de color, ajusta el ángulo y posición, y copia el CSS listo para usar.
CSS
background: linear-gradient(135deg, #6366f1 0%, #06b6d4 100%);Tipo
Ángulo135°
Paradas de Color
0%
100%
Preestablecidos
Tipos de degradado
Los degradados lineales hacen transición a lo largo de una línea recta en cualquier ángulo. Los degradados radiales irradian desde un punto central. Los degradados cónicos barren alrededor de un punto central — útiles para gráficos circulares y ruedas de color.
Cómo usar
- Elige un tipo de degradado (lineal, radial o cónico).
- Añade o arrastra paradas de color para definir los colores.
- Copia la salida CSS directamente en tu hoja de estilos.
Todo el procesamiento ocurre en tu navegador — nada se envía a ningún servidor.
Preguntas Frecuentes
- ¿El CSS generado es compatible con todos los navegadores?
- Sí. La salida utiliza sintaxis estándar de degradados CSS compatible con todos los navegadores modernos.
- ¿Puedo compartir un degradado?
- Sí. Haz clic en Compartir — el estado del degradado está codificado en la URL, que puedes copiar y enviar.