Nächste benannte Farbe · #80B7D1
#80B7D1
Nächste benannte Farbe: Juvie
#80B7D1 (rgb(128 183 209), hsl(199 47% 66%), oklch(0.751 0.068 229.1)) liegt am nächsten an der benannten Farbe Juvie. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#80B7D1
oklch(0.751 0.068 229.1)
Farbumrechnungen
- HEX
- #80b7d1
- RGB
- rgb(128 183 209)
- HSL
- hsl(199 47% 66%)
- HWB
- hwb(199 50% 18%)
- OKLCH
- oklch(0.751 0.068 229.1)
- OKLab
- oklab(0.751 -0.045 -0.052)
- CIE Lab
- lab(71.29 -13.67 -19.22)
- LCH
- lch(71.29 23.59 234.6)
- CMYK
- cmyk(39% 12% 0% 18%)
Tints · Shades · Tones
Tints
- 8DBED6
- 9AC5DA
- A7CCDF
- B3D4E4
- C0DBE8
- CCE2ED
- D9E9F1
- E6F1F6
- F2F8FA
Shades
- 6E9FB5
- 5D879B
- 4D7081
- 3D5A68
- 2E4550
- 1F3139
- 121E23
- 060C10
- 010202
Tones
- 81B1C9
- 81ACC0
- 82A6B8
- 82A1B0
- 829BA8
- 8296A0
- 819098
- 818B90
- 818588
Farbharmonien
Komplementär +180°
- 80B7D1
Juvie
- D3A288
≈ Orange Maple
Analog -30° +30°
Triadisch +120° +240°
- 80B7D1
Juvie
- D09DB5
≈ Quilted Heart
- B1B280
≈ Weeping Willow
Geteilt komplementär +150° +210°
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.18:1 · APCA Lc 43
Ag
AAAAuf Schwarz
WCAG 9.61:1 · APCA Lc 59
Beste Textfarbe: #000000
WCAG 9.61:1 (AAA) · APCA Lc 59
Contrast pairs
Code-Snippets
CSS
:root {
--juvie: #80b7d1;
--juvie-rgb: 128 183 209;
--juvie-oklch: oklch(0.751 0.068 229.1);
}
.element {
color: var(--juvie);
background-color: hsl(199 47% 66%);
border-color: oklch(0.751 0.068 229.1);
}Tailwind CSS v4
@theme {
--color-juvie: #80b7d1;
--color-juvie-50: #e2f9ff;
--color-juvie-100: #d2edfb;
--color-juvie-200: #b8daed;
--color-juvie-300: #94bed4;
--color-juvie-400: #73a7bf;
--color-juvie-500: #528fab;
--color-juvie-600: #477990;
--color-juvie-700: #386173;
--color-juvie-800: #274755;
--color-juvie-900: #1a313b;
--color-juvie-950: #0a1d25;
}SCSS
$juvie: #80b7d1;
$juvie-rgb: 128, 183, 209;
$juvie-light: mix(#fff, $juvie, 20%);
$juvie-dark: mix(#000, $juvie, 20%);
.element {
color: $juvie;
box-shadow: 0 0 0 2px rgba($juvie, 0.35);
}