Farbverlauf Quiet Borealis

Ein CSS-Farbverlauf (linear) aus 4 Farben, von #18001B bis #00DBC3, in OKLCH interpoliert, damit die Mitte lebendig bleibt.

AuroraViolett

Stopps

HEXRGBOKLCHPosition
#18001B rgb(24, 0, 27) oklch(14.9% 0.07 324) 0%
#3F3A9F rgb(63, 58, 159) oklch(41.7% 0.158 279.2) 33%
#0084B8 rgb(0, 132, 184) oklch(57.9% 0.123 235.2) 67%
#00DBC3 rgb(0, 219, 195) oklch(79.9% 0.144 181.2) 100%

CSS

Die erste Deklaration ist ein einfacher sRGB-Farbverlauf für jeden Browser. Die zweite interpoliert in OKLCH, wodurch die Mitte so lebendig bleibt wie die Enden.

background: linear-gradient(270deg, #18001B, #3F3A9F, #0084B8, #00DBC3);
background: linear-gradient(270deg in oklch, #18001B, #3F3A9F, #0084B8, #00DBC3);

Tailwind CSS v4

bg-linear-[270deg_in_oklch,#18001B,#3F3A9F,#0084B8,#00DBC3]

Mach sie zu deiner

Ändere Stopps, Winkel und Typ im Farbverlauf-Generator oder mach aus den Stopps eine Palette.