← Back to Editor

#EED489 · #D4B572 · #A1C0B0 · #75BAA8 · #A6834B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#EED489

Goose Yellow · Khaki · Sunflower

HEX
#EED489
RGB
rgb(238, 212, 137)
HSL
hsl(45, 75%, 74%)
HSB
hsb(45, 42%, 93%)
CMYK
cmyk(0%, 11%, 42%, 7%)
Oklch
oklch(87.5% 0.099 91.0)

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

#D4B572

Ginger · BurlyWood · Sunflower

HEX
#D4B572
RGB
rgb(212, 181, 114)
HSL
hsl(41, 53%, 64%)
HSB
hsb(41, 46%, 83%)
CMYK
cmyk(0%, 15%, 46%, 17%)
Oklch
oklch(78.5% 0.093 85.5)

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

#A1C0B0

Celadon · DarkGray · Apple Green

HEX
#A1C0B0
RGB
rgb(161, 192, 176)
HSL
hsl(149, 20%, 69%)
HSB
hsb(149, 16%, 75%)
CMYK
cmyk(16%, 0%, 8%, 25%)
Oklch
oklch(78.0% 0.040 162.9)

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

#75BAA8

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#75BAA8
RGB
rgb(117, 186, 168)
HSL
hsl(164, 33%, 59%)
HSB
hsb(164, 37%, 73%)
CMYK
cmyk(37%, 0%, 10%, 27%)
Oklch
oklch(73.8% 0.075 175.7)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#A6834B

Ochre · Sienna · Amber Brown

HEX
#A6834B
RGB
rgb(166, 131, 75)
HSL
hsl(37, 38%, 47%)
HSB
hsb(37, 55%, 65%)
CMYK
cmyk(0%, 21%, 55%, 35%)
Oklch
oklch(63.1% 0.085 78.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EED489
8BA4EE

Analogous

EEA48B
EED489
D6EE8B

Triadic

EED489
8BEED6
D68BEE

Split-Comp.

EED489
8BD6EE
A48BEE

Tetradic

EED489
8BEEA4
8BA4EE
EE8BD6

Contrast Matrix WCAG 2.1 Contrast

EED489
D4B572
A1C0B0
75BAA8
A6834B
—
1.4
Fail
1.3
Fail
1.5
Fail
2.4
Fail
1.4
Fail
—
1.0
Fail
1.1
Fail
1.8
Fail
1.3
Fail
1.0
Fail
—
1.1
Fail
1.8
Fail
1.5
Fail
1.1
Fail
1.1
Fail
—
1.6
Fail
2.4
Fail
1.8
Fail
1.8
Fail
1.6
Fail
—
White BG
1.5Fail
2.0Fail
2.0Fail
2.2Fail
3.5AA Large
Black BG
14.4AAA
10.7AAA
10.7AAA
9.3AAA
6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E3E39B
C7C682
AEAFB4
9393AC
979759

Deuteranopia

E4E6A0
C8CB86
ADAAB5
8F8AAD
999C5C

Tritanopia

EDA9AD
D28F92
A3B7B8
78B0B1
A46366

Achromatopsia

D3D3D3
B7B7B7
B5B5B5
A3A3A3
878787

Shades & Tints Shades & Tints

#EED489

Dark
Light

#D4B572

Dark
Light

#A1C0B0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eed489;
  --color-2: #d4b572;
  --color-3: #a1c0b0;
  --color-4: #75baa8;
  --color-5: #a6834b;
}

SCSS

$color-1: #eed489;
$color-2: #d4b572;
$color-3: #a1c0b0;
$color-4: #75baa8;
$color-5: #a6834b;

TAILWIND

colors: {
  'brand-1': '#eed489',
  'brand-2': '#d4b572',
  'brand-3': '#a1c0b0',
  'brand-4': '#75baa8',
  'brand-5': '#a6834b',
}

RGB Array

[238, 212, 137], [212, 181, 114], [161, 192, 176], [117, 186, 168], [166, 131, 75]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EED489, #D4B572, #A1C0B0, #75BAA8, #A6834B 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: #eed489; --color-2: #d4b572; --color-3: #a1c0b0; --color-4: #75baa8; --color-5: #a6834b. 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