Named color · #5A7C46
Mossy Green
Mossy Green is #5A7C46: rgb(90 124 70), hsl(98 28% 38%), oklch(0.546 0.088 134.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Mossy Green color name →
#5A7C46
oklch(0.546 0.088 134.7)
Color conversions
- HEX
- #5a7c46
- RGB
- rgb(90 124 70)
- HSL
- hsl(98 28% 38%)
- HWB
- hwb(98 27% 51%)
- OKLCH
- oklch(0.546 0.088 134.7)
- OKLab
- oklab(0.546 -0.062 0.063)
- CIE Lab
- lab(48.38 -20.48 25.38)
- LCH
- lch(48.38 32.62 128.9)
- CMYK
- cmyk(27% 0% 44% 51%)
Tints · Shades · Tones
Tints
- 698958
- 79956A
- 89A27B
- 99AF8D
- AABCA0
- BAC9B2
- CBD6C5
- DCE4D8
- EDF1EB
Shades
- 4D6B3C
- 415A32
- 354A28
- 293B1E
- 1E2C15
- 131E0D
- 091105
- 030502
- 000100
Tones
- 5E7D4C
- 627D53
- 667E59
- 6A7E5E
- 6D7E64
- 717F6A
- 757F6F
- 798075
- 7C807B
Color harmonies
Complementary +180°
- 5A7C46
Mossy Green
- 846094
≈ Swiss Lilac
Analogous -30° +30°
- 5A7C46
Mossy Green
- 787330
≈ Wood Garlic
- 368163
≈ Dream Green
Triadic +120° +240°
- 5A7C46
Mossy Green
- 4C73A3
≈ Great Serpent
- 9D5A60
≈ Ruby Crystal
Split-complementary +150° +210°
- 5A7C46
Mossy Green
- 6B69A2
≈ Inner Journey
- 955B7D
≈ Immortality
Tetradic +90° +180° +270°
- 5A7C46
Mossy Green
- 287B97
≈ Turkish Stone
- 846094
≈ Swiss Lilac
- 9B5F44
≈ Vintage Copper
Contrast & accessibility
Ag
AAOn white
WCAG 4.76:1 · APCA Lc 73
Ag
FailOn black
WCAG 4.40:1 · APCA Lc 29
Best text color: #FFFFFF
WCAG 4.76:1 (AA) · APCA Lc 73
Contrast pairs
Code snippets
CSS
:root {
--mossy-green: #5a7c46;
--mossy-green-rgb: 90 124 70;
--mossy-green-oklch: oklch(0.546 0.088 134.7);
}
.element {
color: var(--mossy-green);
background-color: hsl(98 28% 38%);
border-color: oklch(0.546 0.088 134.7);
}Tailwind CSS v4
@theme {
--color-mossy-green: #5a7c46;
--color-mossy-green-50: #eafce3;
--color-mossy-green-100: #dbefd2;
--color-mossy-green-200: #c3deb9;
--color-mossy-green-300: #a3c296;
--color-mossy-green-400: #88aa75;
--color-mossy-green-500: #6d9356;
--color-mossy-green-600: #5c7d49;
--color-mossy-green-700: #4a643a;
--color-mossy-green-800: #364928;
--color-mossy-green-900: #25331b;
--color-mossy-green-950: #141e0b;
}SCSS
$mossy-green: #5a7c46;
$mossy-green-rgb: 90, 124, 70;
$mossy-green-light: mix(#fff, $mossy-green, 20%);
$mossy-green-dark: mix(#000, $mossy-green, 20%);
.element {
color: $mossy-green;
box-shadow: 0 0 0 2px rgba($mossy-green, 0.35);
}