← Back to Editor

#BDB238 · #D9E7BB · #131B00 · #0E5E00 · #679407

nature

A 5-color nature palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile AppData Visualization

Color Details Color Details

#BDB238

Autumn Sage · GoldenRod · Honey Gold

HEX
#BDB238
RGB
rgb(189, 178, 56)
HSL
hsl(55, 54%, 48%)
HSB
hsb(55, 70%, 74%)
CMYK
cmyk(0%, 6%, 70%, 26%)
Oklch
oklch(75.1% 0.139 104.1)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#D9E7BB

Willow Green · Wheat · Mint Green

HEX
#D9E7BB
RGB
rgb(217, 231, 187)
HSL
hsl(79, 48%, 82%)
HSB
hsb(79, 19%, 91%)
CMYK
cmyk(6%, 0%, 19%, 9%)
Oklch
oklch(90.6% 0.060 121.9)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#131B00

Grass Green · Black · Dark Green

HEX
#131B00
RGB
rgb(19, 27, 0)
HSL
hsl(78, 100%, 5%)
HSB
hsb(78, 100%, 11%)
CMYK
cmyk(30%, 0%, 100%, 89%)
Oklch
oklch(20.7% 0.051 123.4)

Traditional「Grass Green」· Paint「Dark Green」· Creative Blush Sunrise

#0E5E00

Pine Green · DarkGreen · Dark Green

HEX
#0E5E00
RGB
rgb(14, 94, 0)
HSL
hsl(111, 100%, 18%)
HSB
hsb(111, 100%, 37%)
CMYK
cmyk(85%, 0%, 100%, 63%)
Oklch
oklch(42.0% 0.139 141.3)

Traditional「Pine Green」· Paint「Dark Green」· Creative Blush Sunrise

#679407

Grass Green · Olive · Forest Green

HEX
#679407
RGB
rgb(103, 148, 7)
HSL
hsl(79, 91%, 30%)
HSB
hsb(79, 95%, 58%)
CMYK
cmyk(30%, 0%, 95%, 42%)
Oklch
oklch(61.1% 0.158 128.2)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BDB238
3843BC

Analogous

BC6F38
BDB238
85BC38

Triadic

BDB238
38BCB1
B138BC

Split-Comp.

BDB238
3885BC
6F38BC

Tetradic

BDB238
38BC6F
3843BC
BC3885

Contrast Matrix WCAG 2.1 Contrast

BDB238
D9E7BB
131B00
0E5E00
679407
—
1.7
Fail
8.1
AAA
3.7
AA Large
1.6
Fail
1.7
Fail
—
13.6
AAA
6.1
AA
2.8
Fail
8.1
AAA
13.6
AAA
—
2.2
Fail
4.9
AA
3.7
AA Large
6.1
AA
2.2
Fail
—
2.2
Fail
1.6
Fail
2.8
Fail
4.9
AA
2.2
Fail
—
White BG
2.2Fail
1.3Fail
17.7AAA
8.0AAA
3.6AA Large
Black BG
9.6AAA
16.1AAA
1.2Fail
2.6Fail
5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B8B856
DFDFC6
161707
313117
7A7B29

Deuteranopia

B9BA5D
DEDDC8
161508
2C261C
787531

Tritanopia

BC6D72
DACED0
130C0D
12292D
69444A

Achromatopsia

A7A7A7
DEDEDE
161616
3B3B3B
767676

Shades & Tints Shades & Tints

#BDB238

Dark
Light

#D9E7BB

Dark
Light

#131B00

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bdb238;
  --color-2: #d9e7bb;
  --color-3: #131b00;
  --color-4: #0e5e00;
  --color-5: #679407;
}

SCSS

$color-1: #bdb238;
$color-2: #d9e7bb;
$color-3: #131b00;
$color-4: #0e5e00;
$color-5: #679407;

TAILWIND

colors: {
  'brand-1': '#bdb238',
  'brand-2': '#d9e7bb',
  'brand-3': '#131b00',
  'brand-4': '#0e5e00',
  'brand-5': '#679407',
}

RGB Array

[189, 178, 56], [217, 231, 187], [19, 27, 0], [14, 94, 0], [103, 148, 7]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #BDB238, #D9E7BB, #131B00, #0E5E00, #679407 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #bdb238; --color-2: #d9e7bb; --color-3: #131b00; --color-4: #0e5e00; --color-5: #679407. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This nature-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color