← Back to Editor

#EBF3D4 · #CBD4C0 · #738F9D · #4E4B82 · #BDCBD6

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

WorkspaceReadingData Visualization

Color Details Color Details

#EBF3D4

Willow Green · Beige · Mint Green

HEX
#EBF3D4
RGB
rgb(235, 243, 212)
HSL
hsl(75, 56%, 89%)
HSB
hsb(75, 13%, 95%)
CMYK
cmyk(3%, 0%, 13%, 5%)
Oklch
oklch(95.0% 0.042 119.0)

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

#CBD4C0

Willow Green · LightGray · Apple Green

HEX
#CBD4C0
RGB
rgb(203, 212, 192)
HSL
hsl(87, 19%, 79%)
HSB
hsb(87, 9%, 83%)
CMYK
cmyk(4%, 0%, 9%, 17%)
Oklch
oklch(85.8% 0.029 126.9)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#738F9D

Slate Blue · LightSlateGray · Navy Blue

HEX
#738F9D
RGB
rgb(115, 143, 157)
HSL
hsl(200, 18%, 53%)
HSB
hsb(200, 27%, 62%)
CMYK
cmyk(27%, 9%, 0%, 38%)
Oklch
oklch(63.3% 0.038 229.7)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#4E4B82

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX
#4E4B82
RGB
rgb(78, 75, 130)
HSL
hsl(243, 27%, 40%)
HSB
hsb(243, 42%, 51%)
CMYK
cmyk(40%, 42%, 0%, 49%)
Oklch
oklch(44.2% 0.089 284.6)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#BDCBD6

Sky Blue · LightSteelBlue · Cobalt Blue

HEX
#BDCBD6
RGB
rgb(189, 203, 214)
HSL
hsl(206, 23%, 79%)
HSB
hsb(206, 12%, 84%)
CMYK
cmyk(12%, 5%, 0%, 16%)
Oklch
oklch(83.5% 0.022 241.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EBF3D4
DBD3F3

Analogous

F3EBD3
EBF3D4
DBF3D3

Triadic

EBF3D4
D3EBF3
F3D3EB

Split-Comp.

EBF3D4
D3DBF3
EBD3F3

Tetradic

EBF3D4
D3F3EB
DBD3F3
F3D3DB

Contrast Matrix WCAG 2.1 Contrast

EBF3D4
CBD4C0
738F9D
4E4B82
BDCBD6
—
1.3
Fail
3.0
Fail
6.9
AA
1.4
Fail
1.3
Fail
—
2.2
Fail
5.2
AA
1.1
Fail
3.0
Fail
2.2
Fail
—
2.3
Fail
2.1
Fail
6.9
AA
5.2
AA
2.3
Fail
—
4.8
AA
1.4
Fail
1.1
Fail
2.1
Fail
4.8
AA
—
White BG
1.1Fail
1.5Fail
3.4AA Large
7.9AAA
1.7Fail
Black BG
18.3AAA
13.7AAA
6.1AA
2.7Fail
12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEFDC
CFCFC5
7F7F9A
4D4D75
C3C3D3

Deuteranopia

EEEDDD
CECEC6
7E7B99
4D4D72
C2C1D3

Tritanopia

EBE1E3
CBC9CA
749796
4E6A68
BED1D1

Achromatopsia

EDEDED
CFCFCF
888888
525252
C8C8C8

Shades & Tints Shades & Tints

#EBF3D4

Dark
Light

#CBD4C0

Dark
Light

#738F9D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ebf3d4;
  --color-2: #cbd4c0;
  --color-3: #738f9d;
  --color-4: #4e4b82;
  --color-5: #bdcbd6;
}

SCSS

$color-1: #ebf3d4;
$color-2: #cbd4c0;
$color-3: #738f9d;
$color-4: #4e4b82;
$color-5: #bdcbd6;

TAILWIND

colors: {
  'brand-1': '#ebf3d4',
  'brand-2': '#cbd4c0',
  'brand-3': '#738f9d',
  'brand-4': '#4e4b82',
  'brand-5': '#bdcbd6',
}

RGB Array

[235, 243, 212], [203, 212, 192], [115, 143, 157], [78, 75, 130], [189, 203, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EBF3D4, #CBD4C0, #738F9D, #4E4B82, #BDCBD6 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #ebf3d4; --color-2: #cbd4c0; --color-3: #738f9d; --color-4: #4e4b82; --color-5: #bdcbd6. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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