← Back to Editor

#B4DED5 · #B6CFC9 · #C9C9D6 · #C1BCCC · #A9A0BA

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B4DED5

Jade · LightBlue · Glacier Blue

HEX
#B4DED5
RGB
rgb(180, 222, 213)
HSL
hsl(167, 39%, 79%)
HSB
hsb(167, 19%, 87%)
CMYK
cmyk(19%, 0%, 4%, 13%)
Oklch
oklch(86.8% 0.046 180.7)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#B6CFC9

Jade · Silver · Glacier Blue

HEX
#B6CFC9
RGB
rgb(182, 207, 201)
HSL
hsl(166, 21%, 76%)
HSB
hsb(166, 12%, 81%)
CMYK
cmyk(12%, 0%, 3%, 19%)
Oklch
oklch(83.4% 0.028 179.5)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#C9C9D6

Wisteria · LightGray · Sky Blue

HEX
#C9C9D6
RGB
rgb(201, 201, 214)
HSL
hsl(240, 14%, 81%)
HSB
hsb(240, 6%, 84%)
CMYK
cmyk(6%, 6%, 0%, 16%)
Oklch
oklch(84.0% 0.018 286.0)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

#C1BCCC

Wisteria · Silver · Cobalt Blue

HEX
#C1BCCC
RGB
rgb(193, 188, 204)
HSL
hsl(259, 14%, 77%)
HSB
hsb(259, 8%, 80%)
CMYK
cmyk(5%, 8%, 0%, 20%)
Oklch
oklch(80.4% 0.023 300.1)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#A9A0BA

Wisteria · DarkGray · Lilac Purple

HEX
#A9A0BA
RGB
rgb(169, 160, 186)
HSL
hsl(261, 16%, 68%)
HSB
hsb(261, 14%, 73%)
CMYK
cmyk(9%, 14%, 0%, 27%)
Oklch
oklch(72.2% 0.038 301.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B4DED5
DEB5BE

Analogous

B5DEC0
B4DED5
B5D2DE

Triadic

B4DED5
D5B5DE
DED5B5

Split-Comp.

B4DED5
DEB5D2
DEC0B5

Tetradic

B4DED5
C0B5DE
DEB5BE
D2DEB5

Contrast Matrix WCAG 2.1 Contrast

B4DED5
B6CFC9
C9C9D6
C1BCCC
A9A0BA
—
1.1
Fail
1.1
Fail
1.3
Fail
1.7
Fail
1.1
Fail
—
1.0
Fail
1.1
Fail
1.5
Fail
1.1
Fail
1.0
Fail
—
1.1
Fail
1.5
Fail
1.3
Fail
1.1
Fail
1.1
Fail
—
1.3
Fail
1.7
Fail
1.5
Fail
1.5
Fail
1.3
Fail
—
White BG
1.5Fail
1.6Fail
1.6Fail
1.9Fail
2.5Fail
Black BG
14.3AAA
12.8AAA
12.8AAA
11.3AAA
8.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C6C7D7
C1C1CA
C9C9D3
BFBFC8
A5A5B4

Deuteranopia

C4C1D8
BFBECB
C9C9D2
BFC0C7
A6A6B2

Tritanopia

B6D9D9
B7CCCC
C9D0D0
C1C5C4
A9AFAE

Achromatopsia

D0D0D0
C7C7C7
CACACA
BFBFBF
A6A6A6

Shades & Tints Shades & Tints

#B4DED5

Dark
Light

#B6CFC9

Dark
Light

#C9C9D6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b4ded5;
  --color-2: #b6cfc9;
  --color-3: #c9c9d6;
  --color-4: #c1bccc;
  --color-5: #a9a0ba;
}

SCSS

$color-1: #b4ded5;
$color-2: #b6cfc9;
$color-3: #c9c9d6;
$color-4: #c1bccc;
$color-5: #a9a0ba;

TAILWIND

colors: {
  'brand-1': '#b4ded5',
  'brand-2': '#b6cfc9',
  'brand-3': '#c9c9d6',
  'brand-4': '#c1bccc',
  'brand-5': '#a9a0ba',
}

RGB Array

[180, 222, 213], [182, 207, 201], [201, 201, 214], [193, 188, 204], [169, 160, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B4DED5, #B6CFC9, #C9C9D6, #C1BCCC, #A9A0BA 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: #b4ded5; --color-2: #b6cfc9; --color-3: #c9c9d6; --color-4: #c1bccc; --color-5: #a9a0ba. 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