Nearest named color · #24121F
#24121F
Nearest named color: Shot in the Dark
#24121F (rgb(36 18 31), hsl(317 33% 11%), oklch(0.213 0.037 337.9)) is closest to the named color Shot in the Dark. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#24121F
oklch(0.213 0.037 337.9)
Color conversions
- HEX
- #24121f
- RGB
- rgb(36 18 31)
- HSL
- hsl(317 33% 11%)
- HWB
- hwb(317 7% 86%)
- OKLCH
- oklch(0.213 0.037 337.9)
- OKLab
- oklab(0.213 0.034 -0.014)
- CIE Lab
- lab(8.21 11.46 -5.12)
- LCH
- lch(8.21 12.55 335.9)
- CMYK
- cmyk(0% 50% 14% 86%)
Tints · Shades · Tones
Tints
- 372532
- 4B3A45
- 5F505A
- 746670
- 8A7E86
- A0979D
- B7B0B5
- CFC9CD
- E7E4E6
Shades
- 1E0E19
- 180A14
- 12070F
- 0C040A
- 070206
- 040103
- 020101
- 000000
- 000000
Tones
- 2D1C28
- 352631
- 3E303A
- 473B43
- 50464D
- 5A5157
- 635C61
- 6D686B
- 767475
Color harmonies
Complementary +180°
- 24121F
Shot in the Dark
- 081E12
≈ Clock Chimes Thirteen
Analogous -30° +30°
- 24121F
Shot in the Dark
- 1E1426
≈ Inside
- 271116
≈ Italian Roast
Triadic +120° +240°
- 24121F
Shot in the Dark
- 1E1904
≈ Noir Mystique
- 011D24
≈ Stellar Explorer
Split-complementary +150° +210°
- 24121F
Shot in the Dark
- 141C09
≈ Pinch of Pepper
- 001E1C
≈ Stellar Explorer
Tetradic +90° +180° +270°
- 24121F
Shot in the Dark
- 241505
≈ Cannon Black
- 081E12
≈ Clock Chimes Thirteen
- 0A1A29
≈ Oxford by Night
Contrast & accessibility
Ag
AAAOn white
WCAG 17.77:1 · APCA Lc 104
Ag
FailOn black
WCAG 1.18:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 17.77:1 (AAA) · APCA Lc 104
Contrast pairs
Code snippets
CSS
:root {
--shot-in-the-dark: #24121f;
--shot-in-the-dark-rgb: 36 18 31;
--shot-in-the-dark-oklch: oklch(0.213 0.037 337.9);
}
.element {
color: var(--shot-in-the-dark);
background-color: hsl(317 33% 11%);
border-color: oklch(0.213 0.037 337.9);
}Tailwind CSS v4
@theme {
--color-shot-in-the-dark: #24121f;
--color-shot-in-the-dark-50: #fdf1f8;
--color-shot-in-the-dark-100: #f1e3ec;
--color-shot-in-the-dark-200: #e0ced9;
--color-shot-in-the-dark-300: #c5b0bd;
--color-shot-in-the-dark-400: #ae96a6;
--color-shot-in-the-dark-500: #977d8f;
--color-shot-in-the-dark-600: #806a79;
--color-shot-in-the-dark-700: #665561;
--color-shot-in-the-dark-800: #4b3e47;
--color-shot-in-the-dark-900: #342a31;
--color-shot-in-the-dark-950: #1f181d;
}SCSS
$shot-in-the-dark: #24121f;
$shot-in-the-dark-rgb: 36, 18, 31;
$shot-in-the-dark-light: mix(#fff, $shot-in-the-dark, 20%);
$shot-in-the-dark-dark: mix(#000, $shot-in-the-dark, 20%);
.element {
color: $shot-in-the-dark;
box-shadow: 0 0 0 2px rgba($shot-in-the-dark, 0.35);
}