Crea degradados CSS con vista previa
Los degradados son una de las formas más sencillas de dar vida a un diseño: fondos, botones, tarjetas o cabeceras ganan profundidad con una buena transición de color. Esta herramienta te permite componer el degradado visualmente (eligiendo los colores, el tipo y el ángulo) y te da el código CSS listo para copiar, sin tener que recordar la sintaxis.
Cómo crear tu gradiente
- Elige entre degradado lineal o radial.
- Selecciona los dos colores y, si es lineal, ajusta el ángulo.
- Copia la propiedad CSS y pégala en tu hoja de estilos.
Lineal o radial: cuándo usar cada uno
El degradado lineal va de un color a otro en línea recta, en la dirección que marca el ángulo; es el más común para fondos y botones. El radial parte de un punto central y se expande en círculo, ideal para focos de luz, efectos de halo o fondos con un punto de interés en el centro.
Herramientas relacionadas
Para trabajar con colores, prueba el conversor de color HEX/RGB/HSL. Y para otros recursos de código, escapar HTML o el generador de QR. Más en herramientas de archivos.