#9B348D
#FFB39E
#589D71
#F4EBD9
#0B3D20Evergreen
#1F7A3FFern
#D682D8Orchid
#D8F3DCEggshell
Emerald Orchid & Fern is a complementary color palette tagged modern, green, purple. Evergreen and Eggshell sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Evergreen | #0B3D20 | rgb(11, 61, 32) | hsl(145, 69%, 14%) | oklch(31.9% 0.073 153) | |
| Fern | #1F7A3F | rgb(31, 122, 63) | hsl(141, 59%, 30%) | oklch(51.3% 0.124 151) | |
| Orchid | #D682D8 | rgb(214, 130, 216) | hsl(299, 52%, 68%) | oklch(72.5% 0.151 326) | |
| Eggshell | #D8F3DC | rgb(216, 243, 220) | hsl(129, 53%, 90%) | oklch(93.8% 0.042 150) |
Why it works and how to use it
With 4 chromatic colors, Fern takes the lead while the rest support. Lightness runs from 14% to 90%. Well suited to websites, presentations and branding.
- Background: Eggshell (#D8F3DC) is the lightest color, so it belongs on large surfaces.
- Text: Evergreen (#0B3D20) on #D8F3DC gives 10.44:1, passing WCAG AAA.
- Primary: Fern (#1F7A3F) is the most saturated mid-tone; use it for buttons and links (4.54:1 against the background, fine for UI elements).
- Accent: Orchid (#D682D8) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Evergreen on Eggshell at 10.44:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Emerald Orchid & 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
#0B3D20
#1F7A3F
#D682D8
#D8F3DC
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#0B3D20 on #D8F3DC | Aa | 10.44:1 | AAA |
#0B3D20 on #D682D8 | Aa | 4.72:1 | AA |
#1F7A3F on #D8F3DC | Aa | 4.54:1 | AA |
#0B3D20 on #1F7A3F | Aa | 2.3:1 | Fail |
#D682D8 on #D8F3DC | Aa | 2.21:1 | Fail |
#1F7A3F on #D682D8 | Aa | 2.06:1 | Fail |
Similar palettes 24 more in this mood
#FAFAFA
#E5E7EB
#10B981
#111827
#00A7D3
#FFB3C1
#7BC96F
#2D6A4F
#8A6800
#84A347
#00C38B
#56E7F4
#A630C1
#755EF5
#7ABCFF
#80E6FF
#1A3F1E
#475756
#007C5E
#A7CA57
#DDDEE2
#00C463
#676C7C
#17191F
#00818A
#009D8C
#31CA88
#ACE496
#CDFFC8
#3FB063
#2C7040
#004A14
#3F6D26
#9A8E38
#C4976A
#FFBAAD
#EEABE1
#BFBAC2
#8784AB
#A96C82
#1053C1
#9267B3
#E17BA0
#FFB390
#E2EFEA
#CC64E0
#385B4F
#1D322B
#00616A
#4DA27C
#98AA55
#FFCA7B
#D7263D
#FFFFFF
#F9C5D1
#2E7D5B
#498711
#00AA6D
#00C0AE
#00DDF3
#F9F5FF
#ECD4FF
#526A00
#3A3A3A
#00BA85
#FF8A9B
#C7EFCF
#3D8361
#1B4332
#52B788
#E9F5F0
#C9184A
#A07200
#59964F
#8E9100
#44E9BE
#EDC27E
#B1C06C
#4A8E67
#006364
#09130F
#647970
#704FEE
#E4EBE7
#00735C
#379879
#7DC5A6
#81E3CC
#1B1B1B
#BF9800
#CC3BB1
#F2F2F2