Named color · #5C7F76
Hanging Moss
Hanging Moss is #5C7F76: rgb(92 127 118), hsl(165 16% 43%), oklch(0.567 0.042 177.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Teal mean? → · Hanging Moss color name →
#5C7F76
oklch(0.567 0.042 177.1)
Color conversions
- HEX
- #5c7f76
- RGB
- rgb(92 127 118)
- HSL
- hsl(165 16% 43%)
- HWB
- hwb(165 36% 50%)
- OKLCH
- oklch(0.567 0.042 177.1)
- OKLab
- oklab(0.567 -0.042 0.002)
- CIE Lab
- lab(50.33 -14.43 0.69)
- LCH
- lch(50.33 14.44 177.3)
- CMYK
- cmyk(28% 0% 7% 50%)
Tints · Shades · Tones
Tints
- 6C8B83
- 7B9790
- 8BA49D
- 9BB0AA
- ABBDB8
- BCCAC6
- CCD7D4
- DDE4E2
- EEF2F0
Shades
- 4F6E66
- 425D56
- 364C47
- 2A3C38
- 1F2D29
- 141F1C
- 0A110F
- 030605
- 000101
Tones
- 607F77
- 647F78
- 687F79
- 6B807A
- 6F807B
- 72807C
- 76807D
- 79807E
- 7D807F
Color harmonies
Complementary +180°
- 5C7F76
Hanging Moss
- 8C6D77
≈ Evening Crimson
Analogous -30° +30°
- 5C7F76
Hanging Moss
- 677E68
≈ Ecological
- 597E83
≈ Sultry Bay
Triadic +120° +240°
- 5C7F76
Hanging Moss
- 79728D
≈ Capercaillie Mauve
- 8A715F
≈ Cloudy Cinnamon
Split-complementary +150° +210°
- 5C7F76
Hanging Moss
- 846E84
≈ Purple Grey
- 8E6D69
≈ Moss Rose
Tetradic +90° +180° +270°
- 5C7F76
Hanging Moss
- 6B7690
≈ Legal Eagle
- 8C6D77
≈ Evening Crimson
- 81755A
≈ Private Affair
Contrast & accessibility
Ag
FailOn white
WCAG 4.41:1 · APCA Lc 71
Ag
AAOn black
WCAG 4.75:1 · APCA Lc 31
Best text color: #000000
WCAG 4.75:1 (AA) · APCA Lc 31
Contrast pairs
Code snippets
CSS
:root {
--hanging-moss: #5c7f76;
--hanging-moss-rgb: 92 127 118;
--hanging-moss-oklch: oklch(0.567 0.042 177.1);
}
.element {
color: var(--hanging-moss);
background-color: hsl(165 16% 43%);
border-color: oklch(0.567 0.042 177.1);
}Tailwind CSS v4
@theme {
--color-hanging-moss: #5c7f76;
--color-hanging-moss-50: #e9f9f5;
--color-hanging-moss-100: #daede8;
--color-hanging-moss-200: #c2dad4;
--color-hanging-moss-300: #a1bfb8;
--color-hanging-moss-400: #85a79e;
--color-hanging-moss-500: #689086;
--color-hanging-moss-600: #597a71;
--color-hanging-moss-700: #47615a;
--color-hanging-moss-800: #334741;
--color-hanging-moss-900: #23312d;
--color-hanging-moss-950: #121d1a;
}SCSS
$hanging-moss: #5c7f76;
$hanging-moss-rgb: 92, 127, 118;
$hanging-moss-light: mix(#fff, $hanging-moss, 20%);
$hanging-moss-dark: mix(#000, $hanging-moss, 20%);
.element {
color: $hanging-moss;
box-shadow: 0 0 0 2px rgba($hanging-moss, 0.35);
}