Farbverlauf Sunlit Blueprint

Ein CSS-Farbverlauf (linear) aus 3 Farben, von #1A42AE bis #00C6E1, in OKLCH interpoliert, damit die Mitte lebendig bleibt.

KühlTürkisBlau

Stopps

HEXRGBOKLCHPosition
#1A42AE rgb(26, 66, 174) oklch(42.6% 0.178 264.4) 0%
#0080B8 rgb(0, 128, 184) oklch(56.9% 0.126 237.9) 50%
#00C6E1 rgb(0, 198, 225) oklch(75.9% 0.132 211.9) 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(90deg, #1A42AE, #0080B8, #00C6E1);
background: linear-gradient(90deg in oklch, #1A42AE, #0080B8, #00C6E1);

Tailwind CSS v4

bg-linear-90/oklch from-[#1A42AE] via-[#0080B8] to-[#00C6E1]

Mach sie zu deiner

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