Nearest named color · #9DB9C3
#9DB9C3
Nearest named color: Shallow Sea
#9DB9C3 (rgb(157 185 195), hsl(196 24% 69%), oklch(0.768 0.034 221.4)) is closest to the named color Shallow Sea. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#9DB9C3
oklch(0.768 0.034 221.4)
Color conversions
- HEX
- #9db9c3
- RGB
- rgb(157 185 195)
- HSL
- hsl(196 24% 69%)
- HWB
- hwb(196 62% 24%)
- OKLCH
- oklch(0.768 0.034 221.4)
- OKLab
- oklab(0.768 -0.025 -0.022)
- CIE Lab
- lab(73.28 -8.24 -8.44)
- LCH
- lch(73.28 11.8 225.7)
- CMYK
- cmyk(19% 5% 0% 24%)
Tints · Shades · Tones
Tints
- A7C0C9
- B0C7CF
- BACED5
- C4D5DB
- CDDCE1
- D7E3E7
- E1EAED
- EBF1F3
- F5F8F9
Shades
- 88A0A9
- 738990
- 5F7178
- 4C5B60
- 3A464A
- 283134
- 181E20
- 090D0E
- 010202
Tones
- 9AB3BC
- 97ADB5
- 94A8AE
- 92A2A8
- 8F9CA1
- 8C969A
- 899194
- 868B8D
- 838686
Color harmonies
Complementary +180°
- 9DB9C3
Shallow Sea
- C7ADA3
≈ Glamorous Taupe
Analogous -30° +30°
- 9DB9C3
Shallow Sea
- 9CBBB9
≈ Festoon Aqua
- A4B6C9
≈ Paris Grey
Triadic +120° +240°
- 9DB9C3
Shallow Sea
- C4ACBA
≈ Desireé
- B8B59C
≈ Turtle Trail
Split-complementary +150° +210°
- 9DB9C3
Shallow Sea
- C8ABAE
≈ Vista
- C2B19D
≈ Warm Neutral
Tetradic +90° +180° +270°
- 9DB9C3
Shallow Sea
- BBAEC4
≈ Courtly Purple
- C7ADA3
≈ Glamorous Taupe
- ACB8A2
≈ Winter Squash
Contrast & accessibility
Ag
FailOn white
WCAG 2.06:1 · APCA Lc 40
Ag
AAAOn black
WCAG 10.16:1 · APCA Lc 62
Best text color: #000000
WCAG 10.16:1 (AAA) · APCA Lc 62
Contrast pairs
Code snippets
CSS
:root {
--shallow-sea: #9db9c3;
--shallow-sea-rgb: 157 185 195;
--shallow-sea-oklch: oklch(0.768 0.034 221.4);
}
.element {
color: var(--shallow-sea);
background-color: hsl(196 24% 69%);
border-color: oklch(0.768 0.034 221.4);
}Tailwind CSS v4
@theme {
--color-shallow-sea: #9db9c3;
--color-shallow-sea-50: #ebf7fc;
--color-shallow-sea-100: #ddebf0;
--color-shallow-sea-200: #c6d8df;
--color-shallow-sea-300: #a6bcc4;
--color-shallow-sea-400: #89a3ad;
--color-shallow-sea-500: #6e8c96;
--color-shallow-sea-600: #5d767f;
--color-shallow-sea-700: #4a5f66;
--color-shallow-sea-800: #36454a;
--color-shallow-sea-900: #253034;
--color-shallow-sea-950: #131c1f;
}SCSS
$shallow-sea: #9db9c3;
$shallow-sea-rgb: 157, 185, 195;
$shallow-sea-light: mix(#fff, $shallow-sea, 20%);
$shallow-sea-dark: mix(#000, $shallow-sea, 20%);
.element {
color: $shallow-sea;
box-shadow: 0 0 0 2px rgba($shallow-sea, 0.35);
}