#4A148C
#006746
#BA68C8
#F3E5F5
#E6E0F5Lavender
#B8A7E0Wisteria
#3B7C38Fern
#2A2440Space
Fern & Wisteria Tale is a complementary color palette tagged cold, purple, green. Near-complementary hues (about 141° apart) make this a high-contrast, attention-grabbing combination. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is cool.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Lavender | #E6E0F5 | rgb(230, 224, 245) | hsl(257, 51%, 92%) | oklch(91.8% 0.029 299) | |
| Wisteria | #B8A7E0 | rgb(184, 167, 224) | hsl(258, 48%, 77%) | oklch(76.3% 0.082 298) | |
| Fern | #3B7C38 | rgb(59, 124, 56) | hsl(117, 38%, 35%) | oklch(52.7% 0.121 143) | |
| Space | #2A2440 | rgb(42, 36, 64) | hsl(253, 28%, 20%) | oklch(28.1% 0.051 293) |
Why it works and how to use it
It works because the lightness range is wide (20% to 92%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Lavender (#E6E0F5) is the lightest color, so it belongs on large surfaces.
- Text: Space (#2A2440) on #E6E0F5 gives 11.47:1, passing WCAG AAA.
- Primary: Wisteria (#B8A7E0) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Fern (#3B7C38) for highlights, badges and hover states.
2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Lavender on Space at 11.47:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Fern & Wisteria Tale
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
#E6E0F5
#B8A7E0
#3B7C38
#2A2440
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#E6E0F5 on #2A2440 | Aa | 11.47:1 | AAA |
#B8A7E0 on #2A2440 | Aa | 6.77:1 | AA |
#E6E0F5 on #3B7C38 | Aa | 3.96:1 | AA large only |
#3B7C38 on #2A2440 | Aa | 2.9:1 | Fail |
#B8A7E0 on #3B7C38 | Aa | 2.34:1 | Fail |
#E6E0F5 on #B8A7E0 | Aa | 1.7:1 | Fail |
Similar palettes 24 more in this mood
#3F195F
#7F38AE
#8DC668
#F6F3EA
#101108
#CF9AFF
#14D8FF
#A3E300
#06032E
#5B3CD0
#C6B7FF
#62F3AE
#E6E0F5
#B8A7E0
#6E5BAA
#2A2440
#0B0620
#412676
#009558
#FFB3E6
#3C096C
#00733D
#C77DFF
#E0AAFF
#A0DCA3
#BDE0FE
#CDB4DB
#FDFDFD
#A163FF
#005A89
#004556
#6BD09D
#7B68EE
#A594F9
#CDC1FF
#F5EFFF
#10002B
#5A189A
#9D4EDD
#E0AAFF
#3C096C
#7B2CBF
#C77DFF
#E0AAFF
#03071E
#0B525B
#1B998B
#C2F970
#9FA9FF
#C8AEFF
#F0BFEF
#FFE3EE
#7400B8
#5E60CE
#4EA8DE
#80FFDB
#2D6A4F
#52B788
#95D5B2
#D8F3DC
#0B3D2E
#00FF87
#60EFFF
#FFFFFF
#4B0082
#8A2BE2
#DA70D6
#FFE4F3
#1A1B26
#4B5273
#7AA2F7
#BB9AF7
#F6F1FF
#D8CCF5
#B4A2E8
#3E3560
#14101F
#4D4365
#8E6BFF
#EEE9FF
#692390
#5E6891
#4194F1
#DBD6FF
#00B0CA
#79D213
#00ED9D
#58FDEE
#68709B
#9271DA
#639EC2
#84B8FF