Sobre esta herramienta
Los degradados CSS están por todas partes —fondos hero, botones, tarjetas— pero escribir la sintaxis a mano y adivinar los ángulos es engorroso. Este creador visual te permite añadir y arrastrar paradas de color, fijar el ángulo y cambiar entre degradados lineales, radiales y cónicos mientras ves el resultado llenar una vista previa en vivo.
Cuando quede bien, copia el CSS de background listo directamente a tu hoja de estilos. Es totalmente del lado del cliente, así que experimenta cuanto quieras: no se envía nada.
Preguntas frecuentes
¿Este generador añade prefijos de proveedor como -webkit-linear-gradient?
No. La sintaxis con prefijos solo es necesaria en navegadores muy antiguos (anteriores a 2012), así que la herramienta genera el linear-gradient(), radial-gradient() y conic-gradient() estándar, que entiende cualquier navegador actual.
¿Se sube o guarda en algún sitio mi diseño de gradiente?
No. Todo — los puntos de color, el ángulo y la vista previa — se genera en tiempo real en tu navegador; nada se envía a un servidor.
¿Cuál es la diferencia entre gradiente lineal, radial y cónico?
El lineal mezcla los colores a lo largo de una línea recta en el ángulo elegido, el radial se extiende hacia afuera desde un punto central en círculos, y el cónico gira los colores alrededor de un punto central como una rueda de color.
¿Cuántos puntos de color puedo añadir?
Tantos como necesites — pulsa 'Añadir' para insertar otro punto, arrastra su control deslizante de posición, y elimina cualquier punto salvo los dos últimos.
¿Puedo pegar el CSS generado directamente en mi hoja de estilos?
Sí. Haz clic en Copiar y pega la línea `background: ...;` directamente en cualquier regla CSS o estilo en línea — no requiere ninguna edición.