← Back to Editor

#8D9B4E · #344734 · #AC7636 · #FCCF53 · #EAF5B8

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#8D9B4E

Grass Green · Gray · Olive Green

HEX
#8D9B4E
RGB
rgb(141, 155, 78)
HSL
hsl(71, 33%, 46%)
HSB
hsb(71, 50%, 61%)
CMYK
cmyk(9%, 0%, 50%, 39%)
Oklch
oklch(66.1% 0.103 117.8)

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

#344734

Celadon · DarkSlateGray · Forest Green

HEX
#344734
RGB
rgb(52, 71, 52)
HSL
hsl(120, 15%, 24%)
HSB
hsb(120, 27%, 28%)
CMYK
cmyk(27%, 0%, 27%, 72%)
Oklch
oklch(37.6% 0.040 144.7)

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

#AC7636

Ochre · Sienna · Amber Brown

HEX
#AC7636
RGB
rgb(172, 118, 54)
HSL
hsl(33, 52%, 44%)
HSB
hsb(33, 69%, 67%)
CMYK
cmyk(0%, 31%, 69%, 33%)
Oklch
oklch(60.9% 0.105 68.0)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#FCCF53

Ginger · SandyBrown · Sunflower

HEX
#FCCF53
RGB
rgb(252, 207, 83)
HSL
hsl(44, 97%, 66%)
HSB
hsb(44, 67%, 99%)
CMYK
cmyk(0%, 18%, 67%, 1%)
Oklch
oklch(87.2% 0.147 88.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#EAF5B8

Willow Green · Wheat · Mint Green

HEX
#EAF5B8
RGB
rgb(234, 245, 184)
HSL
hsl(71, 75%, 84%)
HSB
hsb(71, 25%, 96%)
CMYK
cmyk(4%, 0%, 25%, 4%)
Oklch
oklch(94.7% 0.080 116.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8D9B4E
5D4F9C

Analogous

9C834F
8D9B4E
679C4F

Triadic

8D9B4E
4F8E9C
9C4F8E

Split-Comp.

8D9B4E
4F679C
834F9C

Tetradic

8D9B4E
4F9C83
5D4F9C
9C4F67

Contrast Matrix WCAG 2.1 Contrast

8D9B4E
344734
AC7636
FCCF53
EAF5B8
—
3.3
AA Large
1.3
Fail
2.0
Fail
2.6
Fail
3.3
AA Large
—
2.6
Fail
6.8
AA
8.7
AAA
1.3
Fail
2.6
Fail
—
2.6
Fail
3.4
AA Large
2.0
Fail
6.8
AA
2.6
Fail
—
1.3
Fail
2.6
Fail
8.7
AAA
3.4
AA Large
1.3
Fail
—
White BG
3.0AA Large
10.0AAA
3.9AA Large
1.5Fail
1.2Fail
Black BG
6.9AA
2.1Fail
5.4AA
14.2AAA
18.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

939361
3C3C39
959445
E9E871
EFEFC7

Deuteranopia

929165
3B3A3A
989C49
EBEE78
EEEDCA

Tritanopia

8E6F73
353C3D
A95254
FA898E
EBD2D5

Achromatopsia

8E8E8E
3F3F3F
7F7F7F
CECECE
EBEBEB

Shades & Tints Shades & Tints

#8D9B4E

Dark
Light

#344734

Dark
Light

#AC7636

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8d9b4e;
  --color-2: #344734;
  --color-3: #ac7636;
  --color-4: #fccf53;
  --color-5: #eaf5b8;
}

SCSS

$color-1: #8d9b4e;
$color-2: #344734;
$color-3: #ac7636;
$color-4: #fccf53;
$color-5: #eaf5b8;

TAILWIND

colors: {
  'brand-1': '#8d9b4e',
  'brand-2': '#344734',
  'brand-3': '#ac7636',
  'brand-4': '#fccf53',
  'brand-5': '#eaf5b8',
}

RGB Array

[141, 155, 78], [52, 71, 52], [172, 118, 54], [252, 207, 83], [234, 245, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8D9B4E, #344734, #AC7636, #FCCF53, #EAF5B8 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #8d9b4e; --color-2: #344734; --color-3: #ac7636; --color-4: #fccf53; --color-5: #eaf5b8. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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