Farbverlauf Quiet High Noon
Ein CSS-Farbverlauf (linear) aus 4 Farben, von #DEF2FF bis #BF6E4A, in OKLCH interpoliert, damit die Mitte lebendig bleibt.
Stopps
| HEX | RGB | OKLCH | Position |
|---|---|---|---|
| #DEF2FF | rgb(222, 242, 255) | oklch(95% 0.028 236.2) | 0% |
| #B0CBFF | rgb(176, 203, 255) | oklch(84% 0.079 263.3) | 33% |
| #B89FE8 | rgb(184, 159, 232) | oklch(75.1% 0.106 299.6) | 67% |
| #BF6E4A | rgb(191, 110, 74) | oklch(62.1% 0.115 44.1) | 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(120deg, #DEF2FF, #B0CBFF, #B89FE8, #BF6E4A); background: linear-gradient(120deg in oklch, #DEF2FF, #B0CBFF, #B89FE8, #BF6E4A);
Tailwind CSS v4
bg-linear-[120deg_in_oklch,#DEF2FF,#B0CBFF,#B89FE8,#BF6E4A]
Mach sie zu deiner
Ändere Stopps, Winkel und Typ im Farbverlauf-Generator oder mach aus den Stopps eine Palette.
Ähnliche Farbverläufe
- Cozy Windsweptlinear-gradient(90deg, #7B7FC2, #89AADF, #9BD8FF)
- Cozy Poppylinear-gradient(90deg, #0C003F, #FFA73D)
- Vivid Flamingolinear-gradient(135deg, #5C3C84, #F17107)
- Little High Noonlinear-gradient(315deg, #9D7F71, #D699B7, #C9B3FC, #DFF2FF)
- Little Sky Decklinear-gradient(200deg, #DBF3FF, #FFA4CB, #C26C49)
- Evening Skylarklinear-gradient(135deg, #FFE9E2, #C9A4FB, #538FAB)
- Lit Coral Skylinear-gradient(90deg, #26127A, #EC8422, #E1D669)
- Faded Rubylinear-gradient(225deg, #120C4A, #D27400)