← Back to Editor

#EBEFE8 · #B9BDB8 · #9E9796 · #BCC9CF · #DDE3DE

warm

A 5-color warm 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

#EBEFE8

Celadon · Linen · Mint Green

HEX
#EBEFE8
RGB
rgb(235, 239, 232)
HSL
hsl(94, 18%, 92%)
HSB
hsb(94, 3%, 94%)
CMYK
cmyk(2%, 0%, 3%, 6%)
Oklch
oklch(94.7% 0.010 131.4)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#B9BDB8

Silver Gray · Silver · Pearl Gray

HEX
#B9BDB8
RGB
rgb(185, 189, 184)
HSL
hsl(108, 4%, 73%)
HSB
hsb(108, 3%, 74%)
CMYK
cmyk(2%, 0%, 3%, 26%)
Oklch
oklch(79.4% 0.008 139.4)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

#9E9796

Ash · DarkGray · Silver Sand

HEX
#9E9796
RGB
rgb(158, 151, 150)
HSL
hsl(7, 4%, 60%)
HSB
hsb(7, 5%, 62%)
CMYK
cmyk(0%, 4%, 5%, 38%)
Oklch
oklch(68.2% 0.008 27.3)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#BCC9CF

Sky Blue · Silver · Glacier Blue

HEX
#BCC9CF
RGB
rgb(188, 201, 207)
HSL
hsl(199, 17%, 77%)
HSB
hsb(199, 9%, 81%)
CMYK
cmyk(9%, 3%, 0%, 19%)
Oklch
oklch(82.8% 0.017 227.0)

TraditionalSky Blue」· PaintGlacier Blue」· Creative Arctic Pool

#DDE3DE

Celadon · LightGray · Mint Green

HEX
#DDE3DE
RGB
rgb(221, 227, 222)
HSL
hsl(130, 10%, 88%)
HSB
hsb(130, 3%, 89%)
CMYK
cmyk(3%, 0%, 2%, 11%)
Oklch
oklch(91.0% 0.009 150.7)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EBEFE8
EBE7EE

Analogous

EEEEE7
EBEFE8
E7EEE7

Triadic

EBEFE8
E7EAEE
EEE7EA

Split-Comp.

EBEFE8
E7E7EE
EEE7EE

Tetradic

EBEFE8
E7EEEE
EBE7EE
EEE7E7

Contrast Matrix WCAG 2.1 Contrast

EBEFE8
B9BDB8
9E9796
BCC9CF
DDE3DE
1.6
Fail
2.5
Fail
1.5
Fail
1.1
Fail
1.6
Fail
1.5
Fail
1.1
Fail
1.5
Fail
2.5
Fail
1.5
Fail
1.7
Fail
2.2
Fail
1.5
Fail
1.1
Fail
1.7
Fail
1.3
Fail
1.1
Fail
1.5
Fail
2.2
Fail
1.3
Fail
White BG
1.2Fail
1.9Fail
2.9Fail
1.7Fail
1.3Fail
Black BG
18.0AAA
11.0AAA
7.3AAA
12.4AAA
16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDEA
BBBBB9
9B9B96
C2C2CE
E0E0DF

Deuteranopia

EDECEA
BBBAB9
9B9C96
C1C0CD
DFDFDF

Tritanopia

EBEBEB
B9BABA
9E9696
BDCCCC
DDE0E0

Achromatopsia

EDEDED
BBBBBB
999999
C6C6C6
E1E1E1

Shades & Tints Shades & Tints

#EBEFE8

Dark
Light

#B9BDB8

Dark
Light

#9E9796

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ebefe8;
  --color-2: #b9bdb8;
  --color-3: #9e9796;
  --color-4: #bcc9cf;
  --color-5: #dde3de;
}

SCSS

$color-1: #ebefe8;
$color-2: #b9bdb8;
$color-3: #9e9796;
$color-4: #bcc9cf;
$color-5: #dde3de;

TAILWIND

colors: {
  'brand-1': '#ebefe8',
  'brand-2': '#b9bdb8',
  'brand-3': '#9e9796',
  'brand-4': '#bcc9cf',
  'brand-5': '#dde3de',
}

RGB Array

[235, 239, 232], [185, 189, 184], [158, 151, 150], [188, 201, 207], [221, 227, 222]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #EBEFE8, #B9BDB8, #9E9796, #BCC9CF, #DDE3DE 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: #ebefe8; --color-2: #b9bdb8; --color-3: #9e9796; --color-4: #bcc9cf; --color-5: #dde3de. 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 warm-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