← Back to Editor

#E4CAAA · #BDC3B8 · #A3A9B1 · #A389B1 · #A393B1

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E4CAAA

Goose Yellow · Wheat · Peach Orange

HEX
#E4CAAA
RGB
rgb(228, 202, 170)
HSL
hsl(33, 52%, 78%)
HSB
hsb(33, 25%, 89%)
CMYK
cmyk(0%, 11%, 25%, 11%)
Oklch
oklch(85.3% 0.052 72.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#BDC3B8

Celadon · Silver · Pearl Gray

HEX
#BDC3B8
RGB
rgb(189, 195, 184)
HSL
hsl(93, 8%, 74%)
HSB
hsb(93, 6%, 76%)
CMYK
cmyk(3%, 0%, 6%, 24%)
Oklch
oklch(80.9% 0.017 130.5)

Traditional「Celadon」· Paint「Pearl Gray」· Creative Silver Lining

#A3A9B1

Azure · DarkGray · Silver Sand

HEX
#A3A9B1
RGB
rgb(163, 169, 177)
HSL
hsl(214, 8%, 67%)
HSB
hsb(214, 8%, 69%)
CMYK
cmyk(8%, 5%, 0%, 31%)
Oklch
oklch(73.2% 0.013 255.5)

Traditional「Azure」· Paint「Silver Sand」· Creative Urban Concrete

#A389B1

Lilac · DarkGray · Lilac Purple

HEX
#A389B1
RGB
rgb(163, 137, 177)
HSL
hsl(279, 20%, 62%)
HSB
hsb(279, 23%, 69%)
CMYK
cmyk(8%, 23%, 0%, 31%)
Oklch
oklch(66.8% 0.065 313.7)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#A393B1

Lilac · DarkGray · Lilac Purple

HEX
#A393B1
RGB
rgb(163, 147, 177)
HSL
hsl(272, 16%, 64%)
HSB
hsb(272, 17%, 69%)
CMYK
cmyk(8%, 17%, 0%, 31%)
Oklch
oklch(68.7% 0.047 309.1)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E4CAAA
AAC4E4

Analogous

E4ADAA
E4CAAA
E1E4AA

Triadic

E4CAAA
AAE4CA
CAAAE4

Split-Comp.

E4CAAA
AAE1E4
ADAAE4

Tetradic

E4CAAA
AAE4AD
AAC4E4
E4AAE1

Contrast Matrix WCAG 2.1 Contrast

E4CAAA
BDC3B8
A3A9B1
A389B1
A393B1
—
1.1
Fail
1.5
Fail
2.0
Fail
1.8
Fail
1.1
Fail
—
1.3
Fail
1.7
Fail
1.6
Fail
1.5
Fail
1.3
Fail
—
1.3
Fail
1.2
Fail
2.0
Fail
1.7
Fail
1.3
Fail
—
1.1
Fail
1.8
Fail
1.6
Fail
1.2
Fail
1.1
Fail
—
White BG
1.6Fail
1.8Fail
2.4Fail
3.1AA Large
2.9Fail
Black BG
13.3AAA
11.7AAA
8.9AAA
6.8AA
7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D9B2
C0C0BB
A6A6AF
9898A7
9C9CAA

Deuteranopia

DADCB4
BFBFBB
A5A5AF
999BA5
9D9EA8

Tritanopia

E3B8B9
BDBDBD
A3AEAD
A2A09E
A2A4A3

Achromatopsia

CECECE
C0C0C0
A8A8A8
959595
9B9B9B

Shades & Tints Shades & Tints

#E4CAAA

Dark
Light

#BDC3B8

Dark
Light

#A3A9B1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e4caaa;
  --color-2: #bdc3b8;
  --color-3: #a3a9b1;
  --color-4: #a389b1;
  --color-5: #a393b1;
}

SCSS

$color-1: #e4caaa;
$color-2: #bdc3b8;
$color-3: #a3a9b1;
$color-4: #a389b1;
$color-5: #a393b1;

TAILWIND

colors: {
  'brand-1': '#e4caaa',
  'brand-2': '#bdc3b8',
  'brand-3': '#a3a9b1',
  'brand-4': '#a389b1',
  'brand-5': '#a393b1',
}

RGB Array

[228, 202, 170], [189, 195, 184], [163, 169, 177], [163, 137, 177], [163, 147, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E4CAAA, #BDC3B8, #A3A9B1, #A389B1, #A393B1 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: #e4caaa; --color-2: #bdc3b8; --color-3: #a3a9b1; --color-4: #a389b1; --color-5: #a393b1. 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