← Back to Editor

#BFCCAE · #DED59A · #EBD389 · #CE9442 · #A1573A

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

#BFCCAE

Willow Green · Silver · Apple Green

HEX
#BFCCAE
RGB
rgb(191, 204, 174)
HSL
hsl(86, 23%, 74%)
HSB
hsb(86, 15%, 80%)
CMYK
cmyk(6%, 0%, 15%, 20%)
Oklch
oklch(82.7% 0.043 126.5)

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

#DED59A

Fresh Green · Khaki · Sunflower

HEX
#DED59A
RGB
rgb(222, 213, 154)
HSL
hsl(52, 51%, 74%)
HSB
hsb(52, 31%, 87%)
CMYK
cmyk(0%, 4%, 31%, 13%)
Oklch
oklch(86.6% 0.077 100.5)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#EBD389

Goose Yellow · Khaki · Sunflower

HEX
#EBD389
RGB
rgb(235, 211, 137)
HSL
hsl(45, 71%, 73%)
HSB
hsb(45, 42%, 92%)
CMYK
cmyk(0%, 10%, 42%, 8%)
Oklch
oklch(87.0% 0.097 92.1)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#CE9442

Ginger · GoldenRod · Warm Sun

HEX
#CE9442
RGB
rgb(206, 148, 66)
HSL
hsl(35, 59%, 53%)
HSB
hsb(35, 68%, 81%)
CMYK
cmyk(0%, 28%, 68%, 19%)
Oklch
oklch(70.8% 0.120 72.9)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#A1573A

Tangerine · Sienna · Amber Brown

HEX
#A1573A
RGB
rgb(161, 87, 58)
HSL
hsl(17, 47%, 43%)
HSB
hsb(17, 64%, 63%)
CMYK
cmyk(0%, 46%, 64%, 37%)
Oklch
oklch(53.8% 0.106 41.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFCCAE
BBADCC

Analogous

CCCAAD
BFCCAE
AFCCAD

Triadic

BFCCAE
ADBFCC
CCADBF

Split-Comp.

BFCCAE
ADAFCC
CAADCC

Tetradic

BFCCAE
ADCCCA
BBADCC
CCADAF

Contrast Matrix WCAG 2.1 Contrast

BFCCAE
DED59A
EBD389
CE9442
A1573A
—
1.1
Fail
1.1
Fail
1.6
Fail
3.2
AA Large
1.1
Fail
—
1.0
Fail
1.8
Fail
3.6
AA Large
1.1
Fail
1.0
Fail
—
1.8
Fail
3.6
AA Large
1.6
Fail
1.8
Fail
1.8
Fail
—
2.0
Fail
3.2
AA Large
3.6
AA Large
3.6
AA Large
2.0
Fail
—
White BG
1.7Fail
1.5Fail
1.5Fail
2.6Fail
5.3AA
Black BG
12.5AAA
14.1AAA
14.2AAA
7.9AAA
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C5B5
DADAA8
E1E09B
B5B456
818041

Deuteranopia

C4C3B7
DBDBAC
E2E49F
B8BD5B
858B43

Tritanopia

C0BBBC
DEB4B6
EAA9AC
CB6669
9D4748

Achromatopsia

C5C5C5
D1D1D1
D2D2D2
9C9C9C
6A6A6A

Shades & Tints Shades & Tints

#BFCCAE

Dark
Light

#DED59A

Dark
Light

#EBD389

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bfccae;
  --color-2: #ded59a;
  --color-3: #ebd389;
  --color-4: #ce9442;
  --color-5: #a1573a;
}

SCSS

$color-1: #bfccae;
$color-2: #ded59a;
$color-3: #ebd389;
$color-4: #ce9442;
$color-5: #a1573a;

TAILWIND

colors: {
  'brand-1': '#bfccae',
  'brand-2': '#ded59a',
  'brand-3': '#ebd389',
  'brand-4': '#ce9442',
  'brand-5': '#a1573a',
}

RGB Array

[191, 204, 174], [222, 213, 154], [235, 211, 137], [206, 148, 66], [161, 87, 58]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BFCCAE, #DED59A, #EBD389, #CE9442, #A1573A 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: #bfccae; --color-2: #ded59a; --color-3: #ebd389; --color-4: #ce9442; --color-5: #a1573a. 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