#0F5C63
#2A8A8C
#9FD3CF
#F2F1EA
#4E5E3CJuniper
#7E8C63Moss
#B8B29CMushroom
#EEEBE3Eggshell
Moss Stone is a muted analogous color palette tagged muted, white. The hues stay within 44° of each other on the color wheel, which is why the palette feels cohesive rather than busy. Every color is softened, so it works well as a background system for text-heavy layouts. The overall temperature is warm.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Juniper | #4E5E3C | rgb(78, 94, 60) | hsl(88, 22%, 30%) | oklch(45.9% 0.056 129) | |
| Moss | #7E8C63 | rgb(126, 140, 99) | hsl(80, 17%, 47%) | oklch(61.8% 0.061 123) | |
| Mushroom | #B8B29C | rgb(184, 178, 156) | hsl(47, 16%, 67%) | oklch(76.3% 0.031 94) | |
| Eggshell | #EEEBE3 | rgb(238, 235, 227) | hsl(44, 24%, 91%) | oklch(94.0% 0.011 90) |
Why it works and how to use it
Two of the four colors are near-neutral, which leaves room for Moss to lead. Lightness runs from 30% to 91%. Well suited to websites, presentations and branding.
- Background: Eggshell (#EEEBE3) is the lightest color, so it belongs on large surfaces.
- Text: Juniper (#4E5E3C) on #EEEBE3 gives 5.9:1, passing WCAG AA.
- Primary: Moss (#7E8C63) is the most saturated mid-tone; use it for buttons and links (3.03:1 against the background, fine for UI elements).
- Accent: Mushroom (#B8B29C) for highlights, badges and hover states.
1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Juniper on Eggshell at 5.9:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Moss Stone
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
#4E5E3C
#7E8C63
#B8B29C
#EEEBE3
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#4E5E3C on #EEEBE3 | Aa | 5.9:1 | AA |
#4E5E3C on #B8B29C | Aa | 3.31:1 | AA large only |
#7E8C63 on #EEEBE3 | Aa | 3.03:1 | AA large only |
#4E5E3C on #7E8C63 | Aa | 1.95:1 | Fail |
#B8B29C on #EEEBE3 | Aa | 1.78:1 | Fail |
#7E8C63 on #B8B29C | Aa | 1.7:1 | Fail |
Similar palettes 24 more in this mood
#A47864
#C9A58B
#E8D9CB
#F7F3EE
#D9A48F
#EFC8B8
#F7E6DC
#FFFAF6
#0E3B4A
#1F7A8C
#8FD5D2
#EAF7F5
#3C5148
#7A9B76
#C8D5B9
#F6F5EE
#1A4D2E
#4F6F52
#E8DFCA
#F5EFE6
#B08968
#DDB892
#E6CCB2
#FFF6EA
#3E2723
#6D4C41
#A1887F
#EFEBE9
#006D77
#83C5BE
#EDF6F9
#FFDDD2
#3D405B
#81B29A
#F2CC8F
#F4F1DE
#7D6E5D
#B9A990
#E7DFD3
#F9F7F3
#5D4037
#8D6E63
#BCAAA4
#EFEBE9
#A8DADC
#457B9D
#1D3557
#F1FAEE
#1B4965
#5FA8D3
#A8E0DE
#E4F1FF
#4B3832
#854442
#BE9B7B
#FFF4E6
#B76E79
#E8A0A6
#F4C8C8
#FDF2F0
#1B4332
#2D6A4F
#B7B7A4
#F0EFEB
#A68A64
#C2B280
#E6DCC3
#FAF7F0
#C9A66B
#E4C590
#F1E3C8
#F9F5EC
#5B7B6C
#8AA399
#C4D3CC
#EEF3F0
#1C2541
#465D79
#5BC0BE
#FFFFFF
#FDEFF4
#F7C8D8
#CDE7F0
#5B6C8F
#EAF7EF
#BFE8D2
#F9E1C4
#4A6B5A
#F3ECFA
#D9C6F2
#FFD9C2
#5E4B7A