← Back to Editor

#E8A84F · #C6BE55 · #AACC6F · #94D59D · #C4B8A7

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 Library

Color Details Color Details

#E8A84F

Ginger · SandyBrown · Warm Sun

HEX
#E8A84F
RGB
rgb(232, 168, 79)
HSL
hsl(35, 77%, 61%)
HSB
hsb(35, 66%, 91%)
CMYK
cmyk(0%, 28%, 66%, 9%)
Oklch
oklch(77.6% 0.129 72.7)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#C6BE55

Autumn Sage · SandyBrown · Sunflower

HEX
#C6BE55
RGB
rgb(198, 190, 85)
HSL
hsl(56, 50%, 55%)
HSB
hsb(56, 57%, 78%)
CMYK
cmyk(0%, 4%, 57%, 22%)
Oklch
oklch(78.7% 0.127 104.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#AACC6F

Willow Green · DarkSeaGreen · Apple Green

HEX
#AACC6F
RGB
rgb(170, 204, 111)
HSL
hsl(82, 48%, 62%)
HSB
hsb(82, 46%, 80%)
CMYK
cmyk(17%, 0%, 46%, 20%)
Oklch
oklch(79.9% 0.126 125.6)

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

#94D59D

Celadon · LightGreen · Apple Green

HEX
#94D59D
RGB
rgb(148, 213, 157)
HSL
hsl(128, 44%, 71%)
HSB
hsb(128, 31%, 84%)
CMYK
cmyk(31%, 0%, 26%, 16%)
Oklch
oklch(81.5% 0.102 148.1)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#C4B8A7

Goose Yellow · Silver · Warm Sun

HEX
#C4B8A7
RGB
rgb(196, 184, 167)
HSL
hsl(35, 20%, 71%)
HSB
hsb(35, 15%, 77%)
CMYK
cmyk(0%, 6%, 15%, 23%)
Oklch
oklch(78.8% 0.027 76.7)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E8A84F
4F8FE8

Analogous

E85C4F
E8A84F
DBE84F

Triadic

E8A84F
4FE8A8
A84FE8

Split-Comp.

E8A84F
4FDBE8
5C4FE8

Tetradic

E8A84F
4FE85C
4F8FE8
E84FDB

Contrast Matrix WCAG 2.1 Contrast

E8A84F
C6BE55
AACC6F
94D59D
C4B8A7
—
1.1
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
—
White BG
2.1Fail
1.9Fail
1.8Fail
1.7Fail
2.0Fail
Black BG
10.1AAA
10.9AAA
11.6AAA
12.3AAA
10.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCC65
C3C26E
B9B986
B0B1AB
BFBFAB

Deuteranopia

D0D56A
C3C475
B7B48B
ACA8AE
C0C0AC

Tritanopia

E57679
C68287
AC979B
97B5B8
C3AEAF

Achromatopsia

B1B1B1
B4B4B4
B7B7B7
BBBBBB
BABABA

Shades & Tints Shades & Tints

#E8A84F

Dark
Light

#C6BE55

Dark
Light

#AACC6F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e8a84f;
  --color-2: #c6be55;
  --color-3: #aacc6f;
  --color-4: #94d59d;
  --color-5: #c4b8a7;
}

SCSS

$color-1: #e8a84f;
$color-2: #c6be55;
$color-3: #aacc6f;
$color-4: #94d59d;
$color-5: #c4b8a7;

TAILWIND

colors: {
  'brand-1': '#e8a84f',
  'brand-2': '#c6be55',
  'brand-3': '#aacc6f',
  'brand-4': '#94d59d',
  'brand-5': '#c4b8a7',
}

RGB Array

[232, 168, 79], [198, 190, 85], [170, 204, 111], [148, 213, 157], [196, 184, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E8A84F, #C6BE55, #AACC6F, #94D59D, #C4B8A7 is ideal for: corporate websites, product showcases, portfolios. 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: #e8a84f; --color-2: #c6be55; --color-3: #aacc6f; --color-4: #94d59d; --color-5: #c4b8a7. 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. 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