Degradado de violeta a verde azulado

Un degradado suave de violeta a verde azulado en CSS, mezclado en OKLab para que el centro quede limpio. Cambia el ángulo, añade colores y copia el código.

Colores

Mezclar en

OKLab mantiene luminoso el centro. sRGB es como mezclan los navegadores antiguos y a menudo se vuelve gris en el centro.

Tipo

Ángulo90°

CSS

background: linear-gradient(90deg, #ee82ee, #d885e0, #c286d2, #ac87c4, #9587b6, #7d86a8, #62859b, #42838d, #008080);
background: linear-gradient(90deg in oklab, #ee82ee, #008080);

Tailwind CSS v4

bg-linear-90/oklab from-[#ee82ee] to-[#008080]

Colores a lo largo del degradado

Pasos7

Cómo se mezclan violeta y verde azulado en cada espacio de color

Los mismos dos colores dan un centro distinto según el espacio en el que mezcla el navegador. Estos son los colores exactos al 50 %. Estos dos colores se mezclan casi igual en todos los espacios: el centro es #9587b6 en OKLab y #7781b7 en sRGB, así que cualquiera sirve.

Mezclar en	Color central	Luminosidad	Croma
OKLab	#9587b6	65,3 %	0.071
OKLCH	#5e8ee4	65,3 %	0.139
sRGB	#7781b7	61,7 %	0.083
LCH	#3a94e1	64,9 %	0.143
HSL	#0f0fe9	43 %	0.287

Preguntas sobre este degradado

¿Cómo hago un degradado de violeta a verde azulado en CSS?

Usa background: linear-gradient(90deg in oklab, #ee82ee, #008080). Añade antes una línea con la versión sRGB para navegadores muy antiguos. La interpolación en OKLab funciona en todos los navegadores actuales.

¿Qué color hay a medio camino entre violeta y verde azulado?

Mezclado en OKLab, el color a medio camino entre violeta y verde azulado es #9587b6. Una mezcla simple en sRGB da #7781b7.

¿Cómo hago un degradado de violeta a verde azulado en Tailwind CSS?

En Tailwind CSS v4 usa las clases bg-linear-90/oklab from-[#ee82ee] to-[#008080].