#213C04
#356344
#1C8888
#6F9C8F
#647B40Fern
#2D6A65Storm
#025934Hunter Green
#3E3300Taupe
Mossy Hunter Green & Fern is a vivid dark, split color palette tagged forest, nature, muted. The hues span about 126°, enough contrast to create a focal point without the harshness of true complements. These are bold, punchy colors that need generous white space around them. Warm and cool hues are mixed, which adds depth.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Fern | #647B40 | rgb(100, 123, 64) | hsl(83, 32%, 37%) | oklch(55.0% 0.088 127) | |
| Storm | #2D6A65 | rgb(45, 106, 101) | hsl(175, 40%, 30%) | oklch(48.3% 0.063 188) | |
| Hunter Green | #025934 | rgb(2, 89, 52) | hsl(154, 96%, 18%) | oklch(40.9% 0.096 157) | |
| Taupe | #3E3300 | rgb(62, 51, 0) | hsl(49, 100%, 12%) | oklch(32.3% 0.067 96) |
Why it works and how to use it
It works because the lightness steps are gentle (12% to 37%), which keeps the mood consistent from edge to edge. Try it for wellness, organic and outdoor brands.
- Background: Fern (#647B40) is the lightest color, so it belongs on large surfaces.
- Text: Taupe (#3E3300) on #647B40 gives 2.65:1, so pair it with a darker neutral for body copy.
- Primary: Hunter Green (#025934) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Storm (#2D6A65) for highlights, badges and hover states.
No pair inside the palette reaches 4.5:1, so add black or white for body text.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Mossy Hunter Green & Fern
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#647B40
#2D6A65
#025934
#3E3300
Color-blind check: under tritanopia, Storm and Hunter Green become hard to tell apart, so do not rely on that pair alone to carry meaning.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#647B40 on #3E3300 | Aa | 2.65:1 | Fail |
#2D6A65 on #3E3300 | Aa | 2:1 | Fail |
#647B40 on #025934 | Aa | 1.79:1 | Fail |
#025934 on #3E3300 | Aa | 1.48:1 | Fail |
#2D6A65 on #025934 | Aa | 1.35:1 | Fail |
#647B40 on #2D6A65 | Aa | 1.32:1 | Fail |
Similar palettes 24 more in this mood
#82AC82
#6F7A56
#006D51
#003F3C
#2F5D3A
#5E8F5E
#A9C99A
#EEF4E8
#005313
#186F08
#4F8F45
#8FCD85
#00480D
#005748
#007E8C
#5A96BD
#293515
#447F4A
#209E77
#ACAB82
#4EA26C
#AB8F00
#89B56D
#BBC649
#003E41
#005E1A
#008C72
#3787A7
#9AC97E
#7FA16A
#547B3C
#0B4B00
#363300
#006469
#007C60
#599E41
#8DA689
#1EAE81
#009590
#575E24
#676418
#48795B
#95AB83
#4FC5B1
#00561A
#2A6D23
#6CA366
#77BE65
#00937E
#3CA665
#8C9E78
#C1B84B
#72D585
#79A741
#4E947A
#3D3E00
#4D2E00
#567834
#0C9B69
#9A8900
#564D1C
#00807A
#68912E
#7DCCA1
#554223
#9B8A00
#93A869
#DAA785
#53CD8B
#539D55
#007440
#003C16
#A7BA58
#7B9C3D
#4F6D27
#394F00
#003919
#1C8155
#3AA976
#8BC394
#8FCF94
#B68C62
#869937
#776000
#8F7033
#009168
#8AB07C
#BEC196
#006032
#2D636A
#52740F
#41B29F