ZenovayTools

Generador de Degradados CSS

Crea hermosos degradados CSS con un editor visual. Degradados lineales, radiales y cónicos.

135deg
0%
100%
CSS
background: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);

Cómo usar Generador de Degradados CSS

  1. 1Elige el tipo de degradado: lineal, radial o cónico.
  2. 2Añade puntos de color y ajusta sus posiciones en la barra de degradado.
  3. 3Establece el ángulo o dirección del degradado.
  4. 4Obtén una vista previa del degradado en tiempo real en el lienzo.
  5. 5Copia el código CSS generado con un clic.
ZenovayAnalytics

Descubre qué hacen de verdad tus visitantes.

  • Seguimiento de visitantes en tiempo real
  • Privacidad primero, sin aviso de cookies
  • Configurado en dos minutos
Descubre Zenovay

Herramientas relacionadas

Generador de Sombra de Caja CSS
Diseña sombras de caja CSS con controles visuales. Ajusta desplazamiento, desenfoque, expansión y color.
Generador de Borde Redondeado CSS
Crea valores de borde redondeado personalizados con controles visuales. Vincula o desvincula las esquinas para ajustes rápidos.
Área de Juego CSS Flexbox
Aprende y genera diseños CSS Flexbox visualmente. Ajusta dirección, alineación, envoltura y espaciado en tiempo real.
Generador de CSS Grid
Construye diseños CSS Grid con un editor visual. Define columnas, filas, espacios y extiende celdas por áreas.

Preguntas frecuentes

¿Qué tipos de degradados son compatibles?▾
La herramienta admite degradados lineales (con ángulo ajustable) y degradados radiales (círculo). Puede añadir múltiples puntos de color para crear degradados complejos.
¿Cómo añado más colores?▾
Haga clic en el botón "Añadir punto de color" para agregar un nuevo color. Cada punto tiene un selector de color y un deslizador de posición (0-100%). Puede añadir hasta 10 puntos de color.
¿Puedo copiar el código CSS?▾
Sí. El código CSS generado se muestra debajo de la vista previa y se puede copiar con un solo clic. Produce CSS estándar que funciona en todos los navegadores modernos.
¿Genera prefijos de proveedor?▾
No. Los navegadores modernos (Chrome, Firefox, Safari, Edge) admiten degradados CSS sin prefijos. Los prefijos de proveedor ya no son necesarios.
¿Puedo usar esta herramienta en mi teléfono?▾
Sí, el generador de degradados funciona en cualquier navegador móvil moderno. Ajuste colores, posiciones y ángulos con controles táctiles y copie el CSS en cualquier dispositivo.
¿Funciona con Tailwind CSS u otros frameworks?▾
Sí. La herramienta genera propiedades CSS de fondo estándar que funcionan con cualquier framework. En Tailwind, puede usar la sintaxis de valor arbitrario como bg-[linear-gradient(...)] o aplicar el CSS directamente a clases personalizadas.
¿Cuál es el número máximo de puntos de color?▾
Puede añadir hasta 10 puntos de color por degradado. Cada punto tiene un color y una posición ajustables (0-100%), dándole un control preciso sobre la transición del degradado.