Generador de degradados CSS
Elige dos colores y un ángulo y copia el código del degradado CSS.
Generador de degradados CSS
Esta herramienta crea degradados lineales CSS a partir de dos colores y un ángulo, con vista previa en vivo y el código background listo para copiar. Todo en tu navegador.
Cómo funciona linear-gradient
background: linear-gradient(ángulo, color1, color2);
El ángulo indica la dirección: 0° de abajo arriba, 90° de izquierda a derecha, 180° de arriba abajo. Los colores pueden ir en HEX, RGB o HSL.
Consejos
- Para degradados sutiles, usa dos tonos del mismo color.
- Puedes añadir más paradas de color manualmente en el CSS.
- Combínalo con
background-sizepara efectos animados.
Preguntas frecuentes
¿Funciona en todos los navegadores? Sí, linear-gradient tiene soporte universal desde hace años.
¿Radiales o cónicos? Esta versión genera lineales; los radiales/cónicos usan radial-gradient/conic-gradient.