← Back to Editor

#9DA4BF · #B9B1C9 · #CEB8D4 · #E3D3CC · #E8E2CC

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

#9DA4BF

Azure · DarkGray · Cobalt Blue

HEX
#9DA4BF
RGB
rgb(157, 164, 191)
HSL
hsl(228, 21%, 68%)
HSB
hsb(228, 18%, 75%)
CMYK
cmyk(18%, 14%, 0%, 25%)
Oklch
oklch(72.2% 0.040 273.9)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#B9B1C9

Wisteria · Silver · Lilac Purple

HEX
#B9B1C9
RGB
rgb(185, 177, 201)
HSL
hsl(260, 18%, 74%)
HSB
hsb(260, 12%, 79%)
CMYK
cmyk(8%, 12%, 0%, 21%)
Oklch
oklch(77.5% 0.035 300.8)

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

#CEB8D4

Lilac · Silver · Lilac Purple

HEX
#CEB8D4
RGB
rgb(206, 184, 212)
HSL
hsl(287, 25%, 78%)
HSB
hsb(287, 13%, 83%)
CMYK
cmyk(3%, 13%, 0%, 17%)
Oklch
oklch(81.0% 0.046 319.0)

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

#E3D3CC

Apricot · LightGray · Peach Orange

HEX
#E3D3CC
RGB
rgb(227, 211, 204)
HSL
hsl(18, 29%, 85%)
HSB
hsb(18, 10%, 89%)
CMYK
cmyk(0%, 7%, 10%, 11%)
Oklch
oklch(87.8% 0.020 45.2)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E8E2CC

Goose Yellow · Bisque · Lemon Cream

HEX
#E8E2CC
RGB
rgb(232, 226, 204)
HSL
hsl(47, 38%, 85%)
HSB
hsb(47, 12%, 91%)
CMYK
cmyk(0%, 3%, 12%, 9%)
Oklch
oklch(91.2% 0.030 94.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9DA4BF
BFB89C

Analogous

9CB4BF
9DA4BF
A79CBF

Triadic

9DA4BF
BF9CA3
A3BF9C

Split-Comp.

9DA4BF
BFA79C
B4BF9C

Tetradic

9DA4BF
BF9CB4
BFB89C
9CBFA7

Contrast Matrix WCAG 2.1 Contrast

9DA4BF
B9B1C9
CEB8D4
E3D3CC
E8E2CC
—
1.2
Fail
1.3
Fail
1.7
Fail
1.9
Fail
1.2
Fail
—
1.1
Fail
1.4
Fail
1.6
Fail
1.3
Fail
1.1
Fail
—
1.3
Fail
1.4
Fail
1.7
Fail
1.4
Fail
1.3
Fail
—
1.1
Fail
1.9
Fail
1.6
Fail
1.4
Fail
1.1
Fail
—
White BG
2.5Fail
2.1Fail
1.8Fail
1.5Fail
1.3Fail
Black BG
8.5AAA
10.2AAA
11.4AAA
14.5AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A0A0B8
B6B5C3
C4C4CD
DCDCCE
E5E5D1

Deuteranopia

A09FB7
B6B7C2
C6C7CC
DDDECE
E6E6D3

Tritanopia

9DB3B2
B9BFBE
CDC8C7
E2CFCF
E8D6D6

Achromatopsia

A5A5A5
B6B6B6
C2C2C2
D7D7D7
E1E1E1

Shades & Tints Shades & Tints

#9DA4BF

Dark
Light

#B9B1C9

Dark
Light

#CEB8D4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9da4bf;
  --color-2: #b9b1c9;
  --color-3: #ceb8d4;
  --color-4: #e3d3cc;
  --color-5: #e8e2cc;
}

SCSS

$color-1: #9da4bf;
$color-2: #b9b1c9;
$color-3: #ceb8d4;
$color-4: #e3d3cc;
$color-5: #e8e2cc;

TAILWIND

colors: {
  'brand-1': '#9da4bf',
  'brand-2': '#b9b1c9',
  'brand-3': '#ceb8d4',
  'brand-4': '#e3d3cc',
  'brand-5': '#e8e2cc',
}

RGB Array

[157, 164, 191], [185, 177, 201], [206, 184, 212], [227, 211, 204], [232, 226, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9DA4BF, #B9B1C9, #CEB8D4, #E3D3CC, #E8E2CC 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: #9da4bf; --color-2: #b9b1c9; --color-3: #ceb8d4; --color-4: #e3d3cc; --color-5: #e8e2cc. 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