internettoolbox
← Volver a las herramientas

Generador de degradados CSS

Ángulo°
Colores del degradado
0%
100%
CSS generado
Degradados predefinidos

Cómo funciona

Elige un tipo de degradado (lineal, radial o cónico) y constrúyelo de forma visual. Añade todos los colores que quieras con el selector de color, arrastra la posición de cada uno a lo largo de la barra y ajusta el ángulo en el lineal, la forma y el tamaño en el radial o el ángulo inicial en el cónico. La vista previa grande se repinta mientras arrastras, así que ves exactamente lo que renderizará el CSS. Cuando te guste, copia la declaración background generada directamente en tu hoja de estilos o parte de uno de los degradados predefinidos de la galería y retócalo. El resultado es CSS estándar que funciona en todos los navegadores modernos, sin imágenes ni dependencias externas. Toda la configuración va codificada en la URL, así que un degradado terminado se puede compartir como enlace. El editor se ejecuta en tu navegador: no se sube nada y tu degradado no sale de la página.

Preguntas frecuentes

¿Qué tipos de degradado admite?

Tres: lineal (una línea recta con el ángulo que fijes), radial (un círculo o una elipse que se expande desde un punto central) y cónico (un barrido angular alrededor de un punto).

¿Puedo añadir varios colores?

Sí, todos los que necesites. Cada color tiene un tono y una posición, expresada como porcentaje a lo largo del degradado.

¿Se guardan mis datos en algún sitio?

No. Todo se ejecuta en tu navegador y no se sube ningún dato a ningún servidor.

Cambiar de herramienta

Busca y abre cualquier herramienta