Figma color wheel
Want to find the perfect complementary or analogous colors to match moss green?
Skip to main content
Everything you need to know about moss green to inspire your next design.
Moss green is a muted green hue with tranquil and soothing qualities. This color intersects with green, orange, and cyan on the color wheel, reminiscent of a lawn covered in morning dew.

Shades
Tints
Tones
Hues
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Fern
Mystique
Eco Haven
Moss green is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- HEX code: #7E8C54
- RGB value: 49.4% red, 54.9% green, and 32.9% blue
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
Here are some ways to use moss green in your designs:
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
For variations within the same earthy spectrum as moss green, consider:
To complement moss green, consider pairing it with:
Other colors worth considering include brown for a warm and inviting feel, emerald green for a monochromatic color scheme, and lighter greens like sage to create a harmonious palette.
While moss green is earthy and tranquil, it may clash with:
All shades of green are associated with life, health, and nature. This holds true for moss green, which symbolizes growth just like a patch of moss you’d encounter in the wilderness.
In color psychology, green inspires regeneration and wellness. Moss grows everywhere—from damp forests to arid deserts—which is why the color moss green also evokes feelings of resilience and fortitude.
In UI design, moss green’s tranquil qualities can calm users and work well on healthcare and botanical websites. Moss green is also an excellent choice for banking sites that want to promote feelings of stability and safety for users.
The first recorded use of the phrase “moss green” was in 1884 to describe a hue of green that resembles a moss patch. This naturalistic color saw increased use in Europe in everything from fashion to interior design. By 1915, the French military began to employ camouflage that incorporated moss green and other shades of green in woodland operations.
Contemporarily, moss green has experienced a resurgence in popularity due to the prevalence of moss wall art in the late 2010s–2020s.
Contrast 3.64
#7E8C54
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Pass | Fail | |
Pass | Fail |
Contrast 5.77
#7E8C54
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Fail | |
Pass | Pass | |
Pass | Pass |
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #7E8C54, known as moss green, has RGB values of R: 126, G:140, B:84 and CMYK values of C:0.1, M:0, Y:0.4, K:0.45.
| VALUE | CSS | |
|---|---|---|
| HEX | 7E8C54 | #7E8C54 |
| RGB DECIMAL | 126, 140, 84 | RGB(126,140,84) |
| RGB PERCENTAGE | 49.4, 54.9, 32.9 | RGB(49.4%,54.9%,32.9%) |
| CMYK | 10, 0, 40, 45 | |
| HSL | 75°, 25, 44 | HSL(75°,25%,43.9%) |
| HSV (OR HSB) | 75°, 40, 54.9 | |
| WEB SAFE | 669966 | #669966 |
| CIE-LAB | 55.919, -14.686, 28.228 | |
| XYZ | 19.582, 23.832, 11.955 | |
| xyY | 0.354, 0.43, 23.832 | |
| CIE-LCH | 55.919, 31.82, 117.487 | |
| CIE-LUV | 55.919, -5.923, 37.143 | |
| HUNTER-LAB | 48.818, -13.83, 19.652 | |
| BINARY | 01111110, 10001100, 01010100 | |
| iOS - SwiftUI | Color(red: 0.494, green: 0.549, blue: 0.329) | |
| iOS - UIKit | UIColor(red: 0.494, green: 0.549, blue: 0.329, alpha: 1) | |
| Android - Compose | Color(0xFF7E8C54) |
Want to find the perfect complementary or analogous colors to match moss green?
Discover the earthy elegance of tan.
Explore the refreshing feel of green sage.