← Back to Editor

#BEC6BB · #B9D4CF · #D2CCBC · #CCD9D2 · #EEE0D3

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

#BEC6BB

Celadon · Silver · Pearl Gray

HEX
#BEC6BB
RGB
rgb(190, 198, 187)
HSL
hsl(104, 9%, 75%)
HSB
hsb(104, 6%, 78%)
CMYK
cmyk(4%, 0%, 6%, 22%)
Oklch
oklch(81.7% 0.018 137.0)

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

#B9D4CF

Jade · LightSteelBlue · Glacier Blue

HEX
#B9D4CF
RGB
rgb(185, 212, 207)
HSL
hsl(169, 24%, 78%)
HSB
hsb(169, 13%, 83%)
CMYK
cmyk(13%, 0%, 2%, 17%)
Oklch
oklch(84.9% 0.030 183.2)

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

#D2CCBC

Goose Yellow · Silver · Lemon Cream

HEX
#D2CCBC
RGB
rgb(210, 204, 188)
HSL
hsl(44, 20%, 78%)
HSB
hsb(44, 10%, 82%)
CMYK
cmyk(0%, 3%, 10%, 18%)
Oklch
oklch(84.6% 0.023 89.8)

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

#CCD9D2

Celadon · LightGray · Mint Green

HEX
#CCD9D2
RGB
rgb(204, 217, 210)
HSL
hsl(148, 15%, 83%)
HSB
hsb(148, 6%, 85%)
CMYK
cmyk(6%, 0%, 3%, 15%)
Oklch
oklch(87.3% 0.017 162.7)

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

#EEE0D3

Apricot · Bisque · Peach Orange

HEX
#EEE0D3
RGB
rgb(238, 224, 211)
HSL
hsl(29, 44%, 88%)
HSB
hsb(29, 11%, 93%)
CMYK
cmyk(0%, 6%, 11%, 7%)
Oklch
oklch(91.4% 0.023 65.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BEC6BB
C2BAC5

Analogous

C2C5BA
BEC6BB
BAC5BC

Triadic

BEC6BB
BABDC5
C5BABD

Split-Comp.

BEC6BB
BCBAC5
C5BAC2

Tetradic

BEC6BB
BAC2C5
C2BAC5
C5BCBA

Contrast Matrix WCAG 2.1 Contrast

BEC6BB
B9D4CF
D2CCBC
CCD9D2
EEE0D3
—
1.1
Fail
1.1
Fail
1.2
Fail
1.4
Fail
1.1
Fail
—
1.0
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.0
Fail
—
1.1
Fail
1.2
Fail
1.2
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
1.2
Fail
1.2
Fail
1.1
Fail
—
White BG
1.8Fail
1.6Fail
1.6Fail
1.5Fail
1.3Fail
Black BG
12.0AAA
13.4AAA
13.1AAA
14.4AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C1C2BE
C5C5D0
CFCFC0
D2D2D4
E8E8D6

Deuteranopia

C1C0BE
C3C1D0
D0D0C1
D1D0D4
E9EAD7

Tritanopia

BEC0C0
BAD1D1
D2C3C4
CDD5D5
EDD9D9

Achromatopsia

C2C2C2
CBCBCB
CCCCCC
D4D4D4
E3E3E3

Shades & Tints Shades & Tints

#BEC6BB

Dark
Light

#B9D4CF

Dark
Light

#D2CCBC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bec6bb;
  --color-2: #b9d4cf;
  --color-3: #d2ccbc;
  --color-4: #ccd9d2;
  --color-5: #eee0d3;
}

SCSS

$color-1: #bec6bb;
$color-2: #b9d4cf;
$color-3: #d2ccbc;
$color-4: #ccd9d2;
$color-5: #eee0d3;

TAILWIND

colors: {
  'brand-1': '#bec6bb',
  'brand-2': '#b9d4cf',
  'brand-3': '#d2ccbc',
  'brand-4': '#ccd9d2',
  'brand-5': '#eee0d3',
}

RGB Array

[190, 198, 187], [185, 212, 207], [210, 204, 188], [204, 217, 210], [238, 224, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BEC6BB, #B9D4CF, #D2CCBC, #CCD9D2, #EEE0D3 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: #bec6bb; --color-2: #b9d4cf; --color-3: #d2ccbc; --color-4: #ccd9d2; --color-5: #eee0d3. 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