← Back to Editor

#E1D4A7 · #CCCC9A · #BBC193 · #A3B190 · #8AAB8E

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E1D4A7

Goose Yellow · Wheat · Lemon Cream

HEX
#E1D4A7
RGB
rgb(225, 212, 167)
HSL
hsl(47, 49%, 77%)
HSB
hsb(47, 26%, 88%)
CMYK
cmyk(0%, 6%, 26%, 12%)
Oklch
oklch(86.9% 0.061 93.9)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#CCCC9A

Fresh Green · Tan · Sunflower

HEX
#CCCC9A
RGB
rgb(204, 204, 154)
HSL
hsl(60, 33%, 70%)
HSB
hsb(60, 25%, 80%)
CMYK
cmyk(0%, 0%, 25%, 20%)
Oklch
oklch(83.3% 0.066 107.8)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#BBC193

Fresh Green · Tan · Sunflower

HEX
#BBC193
RGB
rgb(187, 193, 147)
HSL
hsl(68, 27%, 67%)
HSB
hsb(68, 24%, 76%)
CMYK
cmyk(3%, 0%, 24%, 24%)
Oklch
oklch(79.4% 0.062 113.9)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#A3B190

Willow Green · DarkSeaGreen · Apple Green

HEX
#A3B190
RGB
rgb(163, 177, 144)
HSL
hsl(85, 17%, 63%)
HSB
hsb(85, 19%, 69%)
CMYK
cmyk(8%, 0%, 19%, 31%)
Oklch
oklch(74.0% 0.049 126.3)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#8AAB8E

Celadon · DarkSeaGreen · Apple Green

HEX
#8AAB8E
RGB
rgb(138, 171, 142)
HSL
hsl(127, 16%, 61%)
HSB
hsb(127, 19%, 67%)
CMYK
cmyk(19%, 0%, 17%, 33%)
Oklch
oklch(70.8% 0.055 148.3)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1D4A7
A8B4E1

Analogous

E1B8A8
E1D4A7
D1E1A8

Triadic

E1D4A7
A8E1D5
D5A8E1

Split-Comp.

E1D4A7
A8D1E1
B8A8E1

Tetradic

E1D4A7
A8E1B8
A8B4E1
E1A8D1

Contrast Matrix WCAG 2.1 Contrast

E1D4A7
CCCC9A
BBC193
A3B190
8AAB8E
1.1
Fail
1.3
Fail
1.5
Fail
1.7
Fail
1.1
Fail
1.1
Fail
1.4
Fail
1.5
Fail
1.3
Fail
1.1
Fail
1.2
Fail
1.3
Fail
1.5
Fail
1.4
Fail
1.2
Fail
1.1
Fail
1.7
Fail
1.5
Fail
1.3
Fail
1.1
Fail
White BG
1.5Fail
1.7Fail
1.9Fail
2.3Fail
2.5Fail
Black BG
14.2AAA
12.7AAA
11.2AAA
9.2AAA
8.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDBB2
CCCCA6
BEBE9E
A9A998
989995

Deuteranopia

DCDDB5
CCCCA9
BDBDA1
A8A79A
969497

Tritanopia

E0BABC
CCB0B2
BBA7A9
A49EA0
8C9B9C

Achromatopsia

D3D3D3
C6C6C6
BABABA
A9A9A9
9E9E9E

Shades & Tints Shades & Tints

#E1D4A7

Dark
Light

#CCCC9A

Dark
Light

#BBC193

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1d4a7;
  --color-2: #cccc9a;
  --color-3: #bbc193;
  --color-4: #a3b190;
  --color-5: #8aab8e;
}

SCSS

$color-1: #e1d4a7;
$color-2: #cccc9a;
$color-3: #bbc193;
$color-4: #a3b190;
$color-5: #8aab8e;

TAILWIND

colors: {
  'brand-1': '#e1d4a7',
  'brand-2': '#cccc9a',
  'brand-3': '#bbc193',
  'brand-4': '#a3b190',
  'brand-5': '#8aab8e',
}

RGB Array

[225, 212, 167], [204, 204, 154], [187, 193, 147], [163, 177, 144], [138, 171, 142]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E1D4A7, #CCCC9A, #BBC193, #A3B190, #8AAB8E is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e1d4a7; --color-2: #cccc9a; --color-3: #bbc193; --color-4: #a3b190; --color-5: #8aab8e. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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