Generador de degradados
Crea degradados CSS lineales, radiales y cónicos desde cero con control de múltiples paradas arrastrables y presets seleccionados. Copia el CSS listo para pegar al instante.
background: —;
Todo se calcula en vivo en tu navegador — sin registro, completamente gratis.
Acerca de Generador de degradados
El Generador de Degradados crea degradados CSS personalizados desde cero. Elige un tipo lineal, radial o cónico, define el ángulo y da forma a la mezcla con un editor de múltiples puntos: arrastra los controladores para mover los puntos, haz clic en la barra para añadir nuevos, y recolorea cualquier punto con un selector; la vista previa en vivo se actualiza mientras trabajas.
Los presets seleccionados te dan un buen punto de partida cuando no quieres comenzar desde una página en blanco, y las acciones de un clic (aleatorio, invertir, rotar 45°) hacen que la exploración sea rápida. El CSS generado siempre está visible y se mantiene sincronizado con la vista previa, así que lo que copias es exactamente lo que viste.
Todo se calcula en tiempo real en tu navegador sin costo alguno. Copia la regla CSS completa o solo el valor de background y pégalo en una hoja de estilos, el estilo de un botón o una sección de héroe: un generador de degradados CSS directo para fondos, superposiciones y acentos de interfaz.
Cómo usar Generador de degradados
- Elige un tipo de degradado: lineal, radial o cónico.
- Empieza con un preset o haz clic en "Aleatorio" para un punto de partida instantáneo.
- Arrastra los controladores de los puntos para posicionar los colores, haz clic en la barra para añadir puntos y edita el color de cada uno.
- Ajusta el ángulo, o usa "Invertir" y "Rotar 45°" para reorientar la mezcla.
- Copia la regla CSS o el valor de background y pégalo en tu proyecto.