a11y.skipToMainContent
1

CSS Gradient Generator

Construir gradientes CSS lineales, radiales o cónicas visualmente. Añadir paradas ilimitadas de color, arrastrar el ángulo, ver la vista previa en vivo, y copiar el CSS.

Color stops

Preview

CSS

Was this tool helpful?
Send output to:
Advertisement

How to use CSS Gradient Generator

  1. Elige lineal, radial o conic.
  2. Ajustar ángulo (linear/conic only) y paradas de color.
  3. Copia el CSS generado.

¿Cómo se llama?

■p Confía en colores, ajustar posiciones, elegir el tipo de gradiente, y ver el resultado actualizar en vivo. Productos CSS-ready code que puedes pegar en cualquier hoja de estilo
Advertisement

FAQ

¿Qué navegadores soportan gradientes conic?
Todos los navegadores modernos. Los navegadores más antiguos simplemente ignorarán la regla y caerán de nuevo a cualquier color de fondo que tenga.
¿Puedo guardar o exportar el CSS gradiente?
Sí. Copie el código CSS generado directamente a su portapapeles. Como todo funciona localmente, tus diseños permanecen privados en tu dispositivo.
¿Hay un límite en las paradas de color?
No hay límite—add tantas paradas de color como necesitáis. La herramienta funciona completamente en su navegador, así que el rendimiento depende de su dispositivo.

Related tools

Author

MW
Marcus Webb"The DevTool Craftsman"

Full-Stack Developer & Tools Architect

Marcus has been writing code since the dial-up era. He has contributed to open-source developer tools, built CI/CD pipelines for startups, and debugged production incidents at 3 AM more times than he would like to admit. His philosophy is that the best developer tool is the one that gets out of your way, and he writes about practical tooling that helps teams ship faster with fewer headaches.

📖 CSS Gradient Generator on Wikipedia·Developer Tools on Wikipedia·CSS Gradient Generator on Britannica

People also use

← Back to Developer Tools · All tags
Advertisement