Named color · #2F3434
Phantom Ship
Phantom Ship is #2F3434: rgb(47 52 52), hsl(180 5% 19%), oklch(0.32 0.007 196.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Phantom Ship color name →
#2F3434
oklch(0.32 0.007 196.8)
Color conversions
- HEX
- #2f3434
- RGB
- rgb(47 52 52)
- HSL
- hsl(180 5% 19%)
- HWB
- hwb(180 18% 80%)
- OKLCH
- oklch(0.32 0.007 196.8)
- OKLab
- oklab(0.32 -0.007 -0.002)
- CIE Lab
- lab(21.22 -2.23 -0.78)
- LCH
- lch(21.22 2.36 199.2)
- CMYK
- cmyk(10% 0% 0% 80%)
Tints · Shades · Tones
Tints
- 414646
- 545858
- 676B6B
- 7B7F7F
- 909393
- A5A8A8
- BBBDBD
- D1D2D2
- E8E9E8
Shades
- 272C2C
- 202424
- 191C1C
- 121515
- 0C0E0E
- 060707
- 030303
- 010101
- 000000
Tones
- 363B3B
- 3E4242
- 464A4A
- 4E5151
- 565959
- 5E6060
- 666868
- 6F7070
- 777878
Color harmonies
Complementary +180°
- 2F3434
Phantom Ship
- 363132
≈ Black Tortoise
Analogous -30° +30°
- 2F3434
Phantom Ship
- 303432
≈ Phantom Ship
- 2F3436
≈ Phantom Ship
Triadic +120° +240°
- 2F3434
Phantom Ship
- 343235
≈ Black Tortoise
- 35322F
≈ Sinister Minister
Split-complementary +150° +210°
- 2F3434
Phantom Ship
- 363133
≈ Black Tortoise
- 363230
≈ Sinister Minister
Tetradic +90° +180° +270°
- 2F3434
Phantom Ship
- 323236
≈ Stiletto
- 363132
≈ Black Tortoise
- 33332F
≈ Oil
Contrast & accessibility
Ag
AAAOn white
WCAG 12.63:1 · APCA Lc 99
Ag
FailOn black
WCAG 1.66:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 12.63:1 (AAA) · APCA Lc 99
Contrast pairs
Code snippets
CSS
:root {
--phantom-ship: #2f3434;
--phantom-ship-rgb: 47 52 52;
--phantom-ship-oklch: oklch(0.32 0.007 196.8);
}
.element {
color: var(--phantom-ship);
background-color: hsl(180 5% 19%);
border-color: oklch(0.32 0.007 196.8);
}Tailwind CSS v4
@theme {
--color-phantom-ship: #2f3434;
--color-phantom-ship-50: #f3f6f6;
--color-phantom-ship-100: #e5e8e9;
--color-phantom-ship-200: #d1d5d5;
--color-phantom-ship-300: #b3b8b9;
--color-phantom-ship-400: #9aa0a0;
--color-phantom-ship-500: #818888;
--color-phantom-ship-600: #6d7373;
--color-phantom-ship-700: #575c5c;
--color-phantom-ship-800: #404343;
--color-phantom-ship-900: #2c2e2e;
--color-phantom-ship-950: #191b1b;
}SCSS
$phantom-ship: #2f3434;
$phantom-ship-rgb: 47, 52, 52;
$phantom-ship-light: mix(#fff, $phantom-ship, 20%);
$phantom-ship-dark: mix(#000, $phantom-ship, 20%);
.element {
color: $phantom-ship;
box-shadow: 0 0 0 2px rgba($phantom-ship, 0.35);
}