Diseño En tu dispositivo · Sin subida

Generador de Degradados CSS Gratuito

Crea degradados CSS lineales y radiales visualmente, previsualízalos al instante y copia el código CSS generado.

El Generador de Gradientes CSS crea gradientes lineales o radiales con ángulo ajustable y hasta tres paradas de color, con vista previa en vivo y copia en un clic de la regla CSS generada. Incluye presets listos (Sunset, Ocean, Purple Glow, Soft Gray) y atajos de dirección. Todo en tu navegador — sin subidas, sin registro, sin cuenta. Creado por FreeToolHub.

Tipo de degradado

Ángulo
deg
Paradas de color

Vista previa

Salida CSS

background: linear-gradient(90deg, #ff7e5f 0%, #feb47b 100%);

Presets rápidos

Crea hermosos degradados CSS para sitios web, botones, fondos y elementos de UI.

Preguntas Frecuentes

¿Qué es un degradado CSS?

Un degradado CSS es una transición suave entre dos o más colores definida completamente en CSS, sin necesitar archivos de imagen. Los degradados se pueden aplicar a cualquier elemento como fondo.

¿Cuál es la diferencia entre degradados lineales y radiales?

Un degradado lineal transiciona los colores a lo largo de una línea recta en un ángulo específico. Un degradado radial transiciona los colores hacia afuera desde un punto central en forma circular o elíptica.

¿Puedo copiar el CSS generado?

Sí. Haz clic en «Copiar CSS» para copiar solo el fragmento CSS al portapapeles. Puedes pegarlo directamente en tu hoja de estilos.

¿Cuántas paradas de color puedo usar?

Este generador soporta hasta 3 paradas de color. Cada parada tiene un color y una posición de 0 % a 100 %.

¿Guarda esta herramienta mi configuración?

No. Toda la configuración es local a tu sesión del navegador. Nada se guarda ni se envía a ningún servidor.

¿Es gratuito este generador?

Sí. El Generador de Degradados CSS es completamente gratuito sin registro ni límites.