What are the hex codes in the Fern Gully palette?

The Fern Gully color palette consists of Hunter Green #2F5D3A, Basil #5E8F5E, Ash #A9C99A, Linen #EEF4E8.

How should I use the Fern Gully palette on a website?

Use Linen #EEF4E8 as the background, Hunter Green #2F5D3A for text, Ash #A9C99A for buttons and links, and Basil #5E8F5E for accents. 1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Hunter Green on Linen at 6.82:1.

Which colors in Fern Gully have enough contrast for text?

The highest-contrast pair is #2F5D3A on #EEF4E8 with a ratio of 6.82:1, which passes WCAG AA for normal text.

#2F5D3AHunter Green

#5E8F5EBasil

#A9C99AAsh

#EEF4E8Linen

Fern Gully color palette

Nature Forest Muted Green White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Hunter Green	`#2F5D3A`	`rgb(47, 93, 58)`	`hsl(134, 33%, 27%)`	`oklch(43.5% 0.077 150)`
Basil	`#5E8F5E`	`rgb(94, 143, 94)`	`hsl(120, 21%, 46%)`	`oklch(60.2% 0.090 144)`
Ash	`#A9C99A`	`rgb(169, 201, 154)`	`hsl(101, 30%, 70%)`	`oklch(80.0% 0.073 136)`
Linen	`#EEF4E8`	`rgb(238, 244, 232)`	`hsl(90, 35%, 93%)`	`oklch(95.9% 0.017 129)`

Why it works and how to use it

Fern Gully is an analogous color palette tagged nature, forest, muted. Analogous neighbors on the wheel (Hunter Green, Basil, Ash) give it a natural, low-tension flow. Saturation is moderate, which keeps it flexible for both interfaces and print.

It works because the lightness range is wide (27% to 93%), which gives clear hierarchy between background, content and accents. Try it for wellness, organic and outdoor brands.

Background: Linen (#EEF4E8) is the lightest color, so it belongs on large surfaces.
Text: Hunter Green (#2F5D3A) on #EEF4E8 gives 6.82:1, passing WCAG AA.
Primary: Ash (#A9C99A) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Basil (#5E8F5E) for highlights, badges and hover states.

1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Hunter Green on Linen at 6.82:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Fern Gully

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#2F5D3A

#5E8F5E

#A9C99A

#EEF4E8

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#2F5D3A` on `#EEF4E8`	Aa	6.82:1	AA
`#2F5D3A` on `#A9C99A`	Aa	4.19:1	AA large only
`#5E8F5E` on `#EEF4E8`	Aa	3.37:1	AA large only
`#5E8F5E` on `#A9C99A`	Aa	2.07:1	Fail
`#2F5D3A` on `#5E8F5E`	Aa	2.03:1	Fail
`#A9C99A` on `#EEF4E8`	Aa	1.63:1	Fail

Similar palettes 24 more in this mood