Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Hunter Green | #006937 | rgb(0, 105, 55) | hsl(151, 100%, 21%) | oklch(45.7% 0.116 154) | |
| Moss | #959C2B | rgb(149, 156, 43) | hsl(64, 57%, 39%) | oklch(66.6% 0.132 113) | |
| Honey | #E69600 | rgb(230, 150, 0) | hsl(39, 100%, 45%) | oklch(73.6% 0.158 72) | |
| Melon | #FFAFA0 | rgb(255, 175, 160) | hsl(9, 100%, 81%) | oklch(82.7% 0.097 31) |
Why it works and how to use it
Fade Honey & Moss is a vivid complementary color palette tagged modern, warm, green. Near-complementary hues (about 142° apart) make this a high-contrast, attention-grabbing combination. Saturation runs high, so use the brightest color sparingly and let the others carry the surface area. Warm and cool hues are mixed, which adds depth.
With 4 chromatic colors, Honey takes the lead while the rest support. Lightness runs from 21% to 81%. Well suited to websites, presentations and branding.
- Background: Melon (#FFAFA0) is the lightest color, so it belongs on large surfaces.
- Text: Hunter Green (#006937) on #FFAFA0 gives 3.87:1, enough for large headings only.
- Primary: Honey (#E69600) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Moss (#959C2B) 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
Design faster with Fade Honey & Moss
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryColor blindness simulation
Color-blind check: under protanopia, Moss and Honey become hard to tell apart, so do not rely on that pair alone to carry meaning.
Palette card

Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#006937 on #FFAFA0 | Aa | 3.87:1 | AA large only |
#006937 on #E69600 | Aa | 2.84:1 | Fail |
#006937 on #959C2B | Aa | 2.3:1 | Fail |
#959C2B on #FFAFA0 | Aa | 1.68:1 | Fail |
#E69600 on #FFAFA0 | Aa | 1.36:1 | Fail |
#959C2B on #E69600 | Aa | 1.23:1 | Fail |