El generador de degradados CSS te permite diseñar degradados lineales, radiales y cónicos en tiempo real — ajusta las paradas de color, el ángulo y las posiciones y luego copia el CSS listo para usar.
Características
- 3 tipos de degradado: lineal (direccional), radial (del centro hacia fuera) y cónico (rotacional — ideal para gráficos circulares y ruedas de color).
- Control del ángulo: define 0–360° para los tipos lineal y cónico con un control deslizante o entrada numérica precisa; el botón de rotación suma 45° en cada clic.
- Paradas de color: cada parada tiene su propio selector de color y control de posición (0–100 %). Mínimo 2 paradas — añade las que quieras.
- 10 preajustes seleccionados, incluidos Sunset, Ocean, Aurora y Conic Pride — haz clic para cargar un preajuste como punto de partida.
- Vista previa grande en vivo: el panel de vista previa de 192 px y la fina barra de degradado se actualizan al instante mientras editas.
- Copia de CSS con un clic: obtén el CSS completo background: gradient(...); listo para pegar en cualquier hoja de estilos o atributo style.
¿Cómo se usa?
- Elige un tipo de degradado, define las paradas de color y el ángulo, o parte de un preajuste.
- Revisa la vista previa y añade o quita paradas de color según haga falta.
- Copia el CSS generado.