← Back to Editor

#CDDEC4 · #CDCFBE · #B4B1A7 · #9B9290 · #FBC6B2

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CDDEC4

Celadon · LightGray · Mint Green

HEX
#CDDEC4
RGB
rgb(205, 222, 196)
HSL
hsl(99, 28%, 82%)
HSB
hsb(99, 12%, 87%)
CMYK
cmyk(8%, 0%, 12%, 13%)
Oklch
oklch(88.1% 0.040 134.6)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#CDCFBE

Fresh Green · Silver · Lemon Cream

HEX
#CDCFBE
RGB
rgb(205, 207, 190)
HSL
hsl(67, 15%, 78%)
HSB
hsb(67, 8%, 81%)
CMYK
cmyk(1%, 0%, 8%, 19%)
Oklch
oklch(84.8% 0.023 112.3)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#B4B1A7

Ginger · DarkGray · Silver Sand

HEX
#B4B1A7
RGB
rgb(180, 177, 167)
HSL
hsl(46, 8%, 68%)
HSB
hsb(46, 7%, 71%)
CMYK
cmyk(0%, 2%, 7%, 29%)
Oklch
oklch(76.0% 0.014 93.0)

TraditionalGinger」· PaintSilver Sand」· Creative Urban Concrete

#9B9290

Ash · Gray · Silver Sand

HEX
#9B9290
RGB
rgb(155, 146, 144)
HSL
hsl(11, 5%, 59%)
HSB
hsb(11, 7%, 61%)
CMYK
cmyk(0%, 6%, 7%, 39%)
Oklch
oklch(66.7% 0.011 32.5)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#FBC6B2

Apricot · LightPink · Peach Orange

HEX
#FBC6B2
RGB
rgb(251, 198, 178)
HSL
hsl(16, 90%, 84%)
HSB
hsb(16, 29%, 98%)
CMYK
cmyk(0%, 21%, 29%, 2%)
Oklch
oklch(86.8% 0.067 41.7)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CDDEC4
D5C4DE

Analogous

DADEC4
CDDEC4
C4DEC8

Triadic

CDDEC4
C4CDDE
DEC4CD

Split-Comp.

CDDEC4
C8C4DE
DEC4DA

Tetradic

CDDEC4
C4DADE
D5C4DE
DEC8C4

Contrast Matrix WCAG 2.1 Contrast

CDDEC4
CDCFBE
B4B1A7
9B9290
FBC6B2
1.1
Fail
1.5
Fail
2.1
Fail
1.1
Fail
1.1
Fail
1.4
Fail
1.9
Fail
1.0
Fail
1.5
Fail
1.4
Fail
1.4
Fail
1.4
Fail
2.1
Fail
1.9
Fail
1.4
Fail
2.0
Fail
1.1
Fail
1.0
Fail
1.4
Fail
2.0
Fail
White BG
1.4Fail
1.6Fail
2.1Fail
3.0AA Large
1.5Fail
Black BG
14.8AAA
13.3AAA
9.8AAA
6.9AA
13.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D4D5CA
CECEC2
B3B3A9
979790
E4E4B7

Deuteranopia

D3D2CC
CECEC3
B3B3AA
989891
E7EBB8

Tritanopia

CECFD0
CDC5C6
B4ABAC
9B9191
F8BBBC

Achromatopsia

D6D6D6
CCCCCC
B1B1B1
949494
D4D4D4

Shades & Tints Shades & Tints

#CDDEC4

Dark
Light

#CDCFBE

Dark
Light

#B4B1A7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cddec4;
  --color-2: #cdcfbe;
  --color-3: #b4b1a7;
  --color-4: #9b9290;
  --color-5: #fbc6b2;
}

SCSS

$color-1: #cddec4;
$color-2: #cdcfbe;
$color-3: #b4b1a7;
$color-4: #9b9290;
$color-5: #fbc6b2;

TAILWIND

colors: {
  'brand-1': '#cddec4',
  'brand-2': '#cdcfbe',
  'brand-3': '#b4b1a7',
  'brand-4': '#9b9290',
  'brand-5': '#fbc6b2',
}

RGB Array

[205, 222, 196], [205, 207, 190], [180, 177, 167], [155, 146, 144], [251, 198, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CDDEC4, #CDCFBE, #B4B1A7, #9B9290, #FBC6B2 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: #cddec4; --color-2: #cdcfbe; --color-3: #b4b1a7; --color-4: #9b9290; --color-5: #fbc6b2. 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