Nearest named color · #909D9F
#909D9F
Nearest named color: Happy Cement
#909D9F (rgb(144 157 159), hsl(188 7% 59%), oklch(0.686 0.015 207.9)) is closest to the named color Happy Cement. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#909D9F
oklch(0.686 0.015 207.9)
Color conversions
- HEX
- #909d9f
- RGB
- rgb(144 157 159)
- HSL
- hsl(188 7% 59%)
- HWB
- hwb(188 56% 38%)
- OKLCH
- oklch(0.686 0.015 207.9)
- OKLab
- oklab(0.686 -0.013 -0.007)
- CIE Lab
- lab(63.74 -4.48 -2.72)
- LCH
- lch(63.74 5.24 211.2)
- CMYK
- cmyk(9% 1% 0% 38%)
Tints · Shades · Tones
Tints
- 9BA6A8
- A5B0B2
- B0B9BB
- BBC3C4
- C6CDCE
- D1D7D8
- DDE1E1
- E8EBEB
- F3F5F5
Shades
- 7D888A
- 6A7375
- 575F61
- 454C4D
- 343A3B
- 242829
- 151818
- 070909
- 010101
Tones
- 8E9A9C
- 8D9799
- 8B9496
- 8A9192
- 888E8F
- 868B8C
- 858989
- 838686
- 828383
Color harmonies
Complementary +180°
- 909D9F
Happy Cement
- A39795
≈ Roman Snail
Analogous -30° +30°
- 909D9F
Happy Cement
- 919D9A
≈ Abyss
- 929CA3
≈ Dustblu
Triadic +120° +240°
- 909D9F
Happy Cement
- A0979F
≈ Lavender Lake
- 9E9A90
≈ Acier
Split-complementary +150° +210°
- 909D9F
Happy Cement
- A3969A
≈ Heather Plume
- A29891
≈ Grey Flanks
Tetradic +90° +180° +270°
- 909D9F
Happy Cement
- 9B98A3
≈ Fortune
- A39795
≈ Roman Snail
- 999C91
≈ Acacia Haze
Contrast & accessibility
Ag
FailOn white
WCAG 2.79:1 · APCA Lc 54
Ag
AAAOn black
WCAG 7.50:1 · APCA Lc 48
Best text color: #000000
WCAG 7.50:1 (AAA) · APCA Lc 48
Contrast pairs
Code snippets
CSS
:root {
--happy-cement: #909d9f;
--happy-cement-rgb: 144 157 159;
--happy-cement-oklch: oklch(0.686 0.015 207.9);
}
.element {
color: var(--happy-cement);
background-color: hsl(188 7% 59%);
border-color: oklch(0.686 0.015 207.9);
}Tailwind CSS v4
@theme {
--color-happy-cement: #909d9f;
--color-happy-cement-50: #f0f6f7;
--color-happy-cement-100: #e2e9eb;
--color-happy-cement-200: #cdd6d8;
--color-happy-cement-300: #afbabc;
--color-happy-cement-400: #95a1a3;
--color-happy-cement-500: #7b898b;
--color-happy-cement-600: #687476;
--color-happy-cement-700: #535d5e;
--color-happy-cement-800: #3d4445;
--color-happy-cement-900: #2a2f30;
--color-happy-cement-950: #171b1c;
}SCSS
$happy-cement: #909d9f;
$happy-cement-rgb: 144, 157, 159;
$happy-cement-light: mix(#fff, $happy-cement, 20%);
$happy-cement-dark: mix(#000, $happy-cement, 20%);
.element {
color: $happy-cement;
box-shadow: 0 0 0 2px rgba($happy-cement, 0.35);
}