Inicio›Herramientas de color› Generador de degradadosNavegador
Crear un degradado CSS
Elige dos colores y un ángulo, mira el resultado a todo lo ancho y copia la declaración CSS directamente a tu hoja de estilos.
background: linear-gradient(135deg, #2f6feb, #a855f7);Cómo se usa
- 1Elige el color inicial y el final.
- 2Fija el ángulo — 0° apunta hacia arriba, y gira en sentido horario desde ahí.
- 3Copia la declaración CSS directamente a tu hoja de estilos.
Preguntas frecuentes
- ¿Hacia dónde apunta el ángulo?
- Sigue la convención de CSS: 0deg apunta arriba, 90deg a la derecha, y continúa en sentido horario. Eso está a un cuarto de vuelta de la convención matemática, que es el motivo habitual de que un degradado salga girado respecto a lo que esperabas.
- ¿Por qué mi degradado se ve sucio en el centro?
- Porque cruza el centro de la rueda de color. De azul a amarillo se pasa por el gris; de azul a morado, no. Mantén los dos tonos cerca el uno del otro, o elige un tono intermedio que sí quieras y párate ahí.
- ¿Puedo usar más de dos colores?
- En esta página no: construye la declaración de dos paradas, que es la que necesita casi todo el mundo. La sintaxis CSS admite tantas paradas como quieras, así que la salida es un punto de partida al que puedes añadir a mano.