Volver a herramientas

Degradado

Color

Crea degradados CSS.

ttb run gradient-generator
135°
0%
50%
100%
background: linear-gradient(135deg, #06b6d4 0%, #8b5cf6 50%, #ec4899 100%);
Comparte esta herramienta:

Cómo usar Degradado

Select two or more colors and set the gradient direction (linear, radial, or conic). Adjust color stops by dragging handles on the gradient bar. The live preview updates instantly. Copy the generated CSS code - including vendor prefixes for maximum browser compatibility - and paste it into your stylesheet.

1

Enter your parameters

Configure the inputs for the Gradient Generator according to your specific needs.

2

View real-time results

The utility instantly processes your request and displays the calculated outputs directly in your browser.

3

Copy or Download

Click the copy icon next to the final output to instantly grab the result, or export it if applicable.

Preguntas frecuentes

What is a CSS gradient?+
A CSS gradient is a smooth transition between two or more colors, rendered by the browser without images. Linear gradients flow in a straight line, radial gradients radiate from a center point, and conic gradients sweep around a point like a pie chart.
Do gradients affect performance?+
CSS gradients are rendered by the GPU and are extremely performant - often faster than loading an equivalent image. They are resolution-independent (no pixelation on retina displays) and add zero HTTP requests.
Mantente Actualizado

Recibe nuevas herramientas antes que nadie.

Obtén nuevas herramientas antes que nadie. Únete a más de 5,000 desarrolladores que reciben nuestro resumen semanal de nuevas utilidades, consejos de código y hacks de productividad. Sin spam, nunca.

© 2026 TinyToolbox. Todos los derechos reservados.

Privacidad primero. Con anuncios. Siempre gratis.

[H4CK]