← Back to Editor

#E6DFD3 · #F5EFEB · #C5DBD3 · #FBF9F6 · #CDD4D3

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

#E6DFD3

Goose Yellow · LightGray · Peach Orange

HEX
#E6DFD3
RGB
rgb(230, 223, 211)
HSL
hsl(38, 28%, 86%)
HSB
hsb(38, 8%, 90%)
CMYK
cmyk(0%, 3%, 8%, 10%)
Oklch
oklch(90.6% 0.018 81.3)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#F5EFEB

Apricot · Linen · Peach Orange

HEX
#F5EFEB
RGB
rgb(245, 239, 235)
HSL
hsl(24, 33%, 94%)
HSB
hsb(24, 4%, 96%)
CMYK
cmyk(0%, 2%, 4%, 4%)
Oklch
oklch(95.6% 0.008 56.3)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

#C5DBD3

Jade · LightGray · Mint Green

HEX
#C5DBD3
RGB
rgb(197, 219, 211)
HSL
hsl(158, 23%, 82%)
HSB
hsb(158, 10%, 86%)
CMYK
cmyk(10%, 0%, 4%, 14%)
Oklch
oklch(87.3% 0.026 171.9)

TraditionalJade」· PaintMint Green」· Creative Arctic Pool

#FBF9F6

Goose Yellow · Snow · Peach Orange

HEX
#FBF9F6
RGB
rgb(251, 249, 246)
HSL
hsl(36, 38%, 97%)
HSB
hsb(36, 2%, 98%)
CMYK
cmyk(0%, 1%, 2%, 2%)
Oklch
oklch(98.3% 0.005 78.3)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#CDD4D3

Jade · LightGray · Pearl Gray

HEX
#CDD4D3
RGB
rgb(205, 212, 211)
HSL
hsl(171, 8%, 82%)
HSB
hsb(171, 3%, 83%)
CMYK
cmyk(3%, 0%, 0%, 17%)
Oklch
oklch(86.4% 0.008 186.9)

TraditionalJade」· PaintPearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E6DFD3
D1D9E5

Analogous

E5D4D1
E6DFD3
E3E5D1

Triadic

E6DFD3
D1E5DE
DED1E5

Split-Comp.

E6DFD3
D1E3E5
D4D1E5

Tetradic

E6DFD3
D1E5D4
D1D9E5
E5D1E3

Contrast Matrix WCAG 2.1 Contrast

E6DFD3
F5EFEB
C5DBD3
FBF9F6
CDD4D3
1.2
Fail
1.1
Fail
1.3
Fail
1.1
Fail
1.2
Fail
1.3
Fail
1.1
Fail
1.3
Fail
1.1
Fail
1.3
Fail
1.4
Fail
1.0
Fail
1.3
Fail
1.1
Fail
1.4
Fail
1.4
Fail
1.1
Fail
1.3
Fail
1.0
Fail
1.4
Fail
White BG
1.3Fail
1.1Fail
1.5Fail
1.1Fail
1.5Fail
Black BG
15.9AAA
18.4AAA
14.4AAA
20.0AAA
14.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E3E3D6
F2F2EC
CFCFD5
FAFAF7
D0D0D3

Deuteranopia

E3E4D7
F3F3EC
CDCCD5
FAFAF7
D0CFD3

Tritanopia

E6D8D9
F5EDED
C6D6D7
FBF7F7
CDD3D3

Achromatopsia

E0E0E0
F0F0F0
D4D4D4
F9F9F9
D2D2D2

Shades & Tints Shades & Tints

#E6DFD3

Dark
Light

#F5EFEB

Dark
Light

#C5DBD3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e6dfd3;
  --color-2: #f5efeb;
  --color-3: #c5dbd3;
  --color-4: #fbf9f6;
  --color-5: #cdd4d3;
}

SCSS

$color-1: #e6dfd3;
$color-2: #f5efeb;
$color-3: #c5dbd3;
$color-4: #fbf9f6;
$color-5: #cdd4d3;

TAILWIND

colors: {
  'brand-1': '#e6dfd3',
  'brand-2': '#f5efeb',
  'brand-3': '#c5dbd3',
  'brand-4': '#fbf9f6',
  'brand-5': '#cdd4d3',
}

RGB Array

[230, 223, 211], [245, 239, 235], [197, 219, 211], [251, 249, 246], [205, 212, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E6DFD3, #F5EFEB, #C5DBD3, #FBF9F6, #CDD4D3 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: #e6dfd3; --color-2: #f5efeb; --color-3: #c5dbd3; --color-4: #fbf9f6; --color-5: #cdd4d3. 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