Named color · #313138
Smiler’s Mist
Smiler’s Mist is #313138: rgb(49 49 56), hsl(240 7% 21%), oklch(0.316 0.012 285.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Smiler’s Mist color name →
#313138
oklch(0.316 0.012 285.7)
Color conversions
- HEX
- #313138
- RGB
- rgb(49 49 56)
- HSL
- hsl(240 7% 21%)
- HWB
- hwb(240 19% 78%)
- OKLCH
- oklch(0.316 0.012 285.7)
- OKLab
- oklab(0.316 0.003 -0.012)
- CIE Lab
- lab(20.54 1.29 -4.45)
- LCH
- lch(20.54 4.64 286.2)
- CMYK
- cmyk(13% 13% 0% 78%)
Tints · Shades · Tones
Tints
- 434349
- 55555B
- 69696E
- 7C7D81
- 919195
- A6A6AA
- BCBCBE
- D2D2D3
- E8E8E9
Shades
- 29292F
- 222227
- 1A1A1F
- 131317
- 0C0C0F
- 060608
- 030304
- 010101
- 000000
Tones
- 38383F
- 404046
- 47474D
- 4F4F54
- 57575B
- 5F5F62
- 676769
- 6F6F71
- 787878
Color harmonies
Complementary +180°
- 313138
Smiler’s Mist
- 32322B
≈ Dryad Bark
Analogous -30° +30°
- 313138
Smiler’s Mist
- 2E3238
≈ Granite Black
- 343036
≈ Lava Black
Triadic +120° +240°
- 313138
Smiler’s Mist
- 37302D
≈ Acadia
- 2C3430
≈ Aztec
Split-complementary +150° +210°
- 313138
Smiler’s Mist
- 36312B
≈ Acadia
- 2F332D
≈ Oil
Tetradic +90° +180° +270°
- 313138
Smiler’s Mist
- 382F30
≈ Smoked Black Coffee
- 32322B
≈ Dryad Bark
- 2B3434
≈ Aztec
Contrast & accessibility
Ag
AAAOn white
WCAG 12.90:1 · APCA Lc 99
Ag
FailOn black
WCAG 1.62:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 12.90:1 (AAA) · APCA Lc 99
Contrast pairs
Code snippets
CSS
:root {
--smiler-s-mist: #313138;
--smiler-s-mist-rgb: 49 49 56;
--smiler-s-mist-oklch: oklch(0.316 0.012 285.7);
}
.element {
color: var(--smiler-s-mist);
background-color: hsl(240 7% 21%);
border-color: oklch(0.316 0.012 285.7);
}Tailwind CSS v4
@theme {
--color-smiler-s-mist: #313138;
--color-smiler-s-mist-50: #f5f5f9;
--color-smiler-s-mist-100: #e7e7ec;
--color-smiler-s-mist-200: #d4d3d9;
--color-smiler-s-mist-300: #b7b6be;
--color-smiler-s-mist-400: #9d9da6;
--color-smiler-s-mist-500: #85858e;
--color-smiler-s-mist-600: #717178;
--color-smiler-s-mist-700: #5a5a60;
--color-smiler-s-mist-800: #424247;
--color-smiler-s-mist-900: #2d2d31;
--color-smiler-s-mist-950: #1a1a1d;
}SCSS
$smiler-s-mist: #313138;
$smiler-s-mist-rgb: 49, 49, 56;
$smiler-s-mist-light: mix(#fff, $smiler-s-mist, 20%);
$smiler-s-mist-dark: mix(#000, $smiler-s-mist, 20%);
.element {
color: $smiler-s-mist;
box-shadow: 0 0 0 2px rgba($smiler-s-mist, 0.35);
}