Nearest named color · #213240
#213240
Nearest named color: Blue Whale
#213240 (rgb(33 50 64), hsl(207 32% 19%), oklch(0.309 0.034 244)) is closest to the named color Blue Whale. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#213240
oklch(0.309 0.034 244)
Color conversions
- HEX
- #213240
- RGB
- rgb(33 50 64)
- HSL
- hsl(207 32% 19%)
- HWB
- hwb(207 13% 75%)
- OKLCH
- oklch(0.309 0.034 244)
- OKLab
- oklab(0.309 -0.015 -0.03)
- CIE Lab
- lab(19.78 -3.83 -11.18)
- LCH
- lch(19.78 11.82 251.1)
- CMYK
- cmyk(48% 22% 0% 75%)
Tints · Shades · Tones
Tints
- 344451
- 485663
- 5D6A75
- 727D87
- 88929A
- 9FA7AE
- B6BCC2
- CED2D6
- E6E8EA
Shades
- 1B2A36
- 16222D
- 101B24
- 0B141B
- 060D13
- 03070B
- 010305
- 000101
- 000000
Tones
- 2A3946
- 33414C
- 3C4853
- 455059
- 4F585F
- 586066
- 62686C
- 6C7073
- 767879
Color harmonies
Complementary +180°
- 213240
Blue Whale
- 3C2C1E
≈ Bistre
Analogous -30° +30°
- 213240
Blue Whale
- 1A343A
≈ Ore Bluish Black
- 2B2F41
≈ Atlantic Charter
Triadic +120° +240°
- 213240
Blue Whale
- 3F292E
≈ Wenge Black
- 2C3320
≈ Rangitoto
Split-complementary +150° +210°
- 213240
Blue Whale
- 3F2A25
≈ English Walnut
- 36301C
≈ Agrax Earthshade
Tetradic +90° +180° +270°
- 213240
Blue Whale
- 3B2A37
≈ Valentino Nero
- 3C2C1E
≈ Bistre
- 223528
≈ Black Leather Jacket
Contrast & accessibility
Ag
AAAOn white
WCAG 13.16:1 · APCA Lc 99
Ag
FailOn black
WCAG 1.59:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 13.16:1 (AAA) · APCA Lc 99
Contrast pairs
Code snippets
CSS
:root {
--blue-whale: #213240;
--blue-whale-rgb: 33 50 64;
--blue-whale-oklch: oklch(0.309 0.034 244);
}
.element {
color: var(--blue-whale);
background-color: hsl(207 32% 19%);
border-color: oklch(0.309 0.034 244);
}Tailwind CSS v4
@theme {
--color-blue-whale: #213240;
--color-blue-whale-50: #eef6ff;
--color-blue-whale-100: #dfe9f3;
--color-blue-whale-200: #c9d6e2;
--color-blue-whale-300: #aabac8;
--color-blue-whale-400: #8ea1b1;
--color-blue-whale-500: #74899b;
--color-blue-whale-600: #627483;
--color-blue-whale-700: #4e5d69;
--color-blue-whale-800: #38444d;
--color-blue-whale-900: #272f36;
--color-blue-whale-950: #151c21;
}SCSS
$blue-whale: #213240;
$blue-whale-rgb: 33, 50, 64;
$blue-whale-light: mix(#fff, $blue-whale, 20%);
$blue-whale-dark: mix(#000, $blue-whale, 20%);
.element {
color: $blue-whale;
box-shadow: 0 0 0 2px rgba($blue-whale, 0.35);
}