Nearest named color · #83B3CE
#83B3CE
Nearest named color: Juvie
#83B3CE (rgb(131 179 206), hsl(202 43% 66%), oklch(0.742 0.064 233.4)) is closest to the named color Juvie. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#83B3CE
oklch(0.742 0.064 233.4)
Color conversions
- HEX
- #83b3ce
- RGB
- rgb(131 179 206)
- HSL
- hsl(202 43% 66%)
- HWB
- hwb(202 51% 19%)
- OKLCH
- oklch(0.742 0.064 233.4)
- OKLab
- oklab(0.742 -0.038 -0.052)
- CIE Lab
- lab(70.25 -11.45 -19.13)
- LCH
- lch(70.25 22.3 239.1)
- CMYK
- cmyk(36% 13% 0% 19%)
Tints · Shades · Tones
Tints
- 8FBBD3
- 9CC2D8
- A8CADD
- B5D1E2
- C1D9E7
- CDE0EC
- DAE8F0
- E6F0F5
- F2F7FA
Shades
- 719BB3
- 608498
- 4F6E7F
- 3F5866
- 2F434E
- 202F38
- 121D23
- 060C0F
- 010102
Tones
- 83AEC6
- 83A9BE
- 83A4B6
- 839EAE
- 8399A6
- 82949F
- 828F97
- 818A8F
- 818588
Color harmonies
Complementary +180°
- 83B3CE
Juvie
- CDA186
≈ Arbol de Tamarindo
Analogous -30° +30°
- 83B3CE
Juvie
- 7AB8BE
≈ Waterway
- 97ACD5
≈ Aster Flower Blue
Triadic +120° +240°
- 83B3CE
Juvie
- CD9BAF
≈ Rosebay
- ABB082
≈ Wall Green
Split-complementary +150° +210°
- 83B3CE
Juvie
- D19C98
≈ Savoury Salmon
- BFA97D
≈ Antiquity
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 2.25:1 · APCA Lc 44
Ag
AAAOn black
WCAG 9.30:1 · APCA Lc 58
Best text color: #000000
WCAG 9.30:1 (AAA) · APCA Lc 58
Contrast pairs
Code snippets
CSS
:root {
--juvie: #83b3ce;
--juvie-rgb: 131 179 206;
--juvie-oklch: oklch(0.742 0.064 233.4);
}
.element {
color: var(--juvie);
background-color: hsl(202 43% 66%);
border-color: oklch(0.742 0.064 233.4);
}Tailwind CSS v4
@theme {
--color-juvie: #83b3ce;
--color-juvie-50: #e4f9ff;
--color-juvie-100: #d4ecfb;
--color-juvie-200: #bbd9ec;
--color-juvie-300: #98bdd4;
--color-juvie-400: #78a5bf;
--color-juvie-500: #598eaa;
--color-juvie-600: #4c7890;
--color-juvie-700: #3d6073;
--color-juvie-800: #2a4755;
--color-juvie-900: #1d313b;
--color-juvie-950: #0c1d25;
}SCSS
$juvie: #83b3ce;
$juvie-rgb: 131, 179, 206;
$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);
}