← Back to Editor

#F7ECD6 · #DCD5C3 · #CACBBD · #96BDB8 · #8A9FA0

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

#F7ECD6

Goose Yellow · Beige · Lemon Cream

HEX
#F7ECD6
RGB
rgb(247, 236, 214)
HSL
hsl(40, 67%, 90%)
HSB
hsb(40, 13%, 97%)
CMYK
cmyk(0%, 4%, 13%, 3%)
Oklch
oklch(94.6% 0.031 84.6)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#DCD5C3

Goose Yellow · LightGray · Lemon Cream

HEX
#DCD5C3
RGB
rgb(220, 213, 195)
HSL
hsl(43, 26%, 81%)
HSB
hsb(43, 11%, 86%)
CMYK
cmyk(0%, 3%, 11%, 14%)
Oklch
oklch(87.4% 0.025 89.2)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#CACBBD

Fresh Green · Silver · Lemon Cream

HEX
#CACBBD
RGB
rgb(202, 203, 189)
HSL
hsl(64, 12%, 77%)
HSB
hsb(64, 7%, 80%)
CMYK
cmyk(0%, 0%, 7%, 20%)
Oklch
oklch(83.7% 0.019 110.1)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#96BDB8

Jade · DarkGray · Lake Green

HEX
#96BDB8
RGB
rgb(150, 189, 184)
HSL
hsl(172, 23%, 66%)
HSB
hsb(172, 21%, 74%)
CMYK
cmyk(21%, 0%, 3%, 26%)
Oklch
oklch(76.9% 0.042 186.7)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#8A9FA0

Slate Blue · LightSlateGray · Lake Green

HEX
#8A9FA0
RGB
rgb(138, 159, 160)
HSL
hsl(183, 10%, 58%)
HSB
hsb(183, 14%, 63%)
CMYK
cmyk(14%, 1%, 0%, 37%)
Oklch
oklch(68.6% 0.024 200.1)

TraditionalSlate Blue」· PaintLake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7ECD6
D4E0F7

Analogous

F7DAD4
F7ECD6
F1F7D4

Triadic

F7ECD6
D4F7EB
EBD4F7

Split-Comp.

F7ECD6
D4F1F7
DAD4F7

Tetradic

F7ECD6
D4F7DA
D4E0F7
F7D4F1

Contrast Matrix WCAG 2.1 Contrast

F7ECD6
DCD5C3
CACBBD
96BDB8
8A9FA0
1.2
Fail
1.4
Fail
1.7
Fail
2.4
Fail
1.2
Fail
1.1
Fail
1.4
Fail
1.9
Fail
1.4
Fail
1.1
Fail
1.2
Fail
1.7
Fail
1.7
Fail
1.4
Fail
1.2
Fail
1.4
Fail
2.4
Fail
1.9
Fail
1.7
Fail
1.4
Fail
White BG
1.2Fail
1.5Fail
1.6Fail
2.0Fail
2.8Fail
Black BG
17.9AAA
14.3AAA
12.8AAA
10.3AAA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F2F2DB
D9D9C7
CACAC0
A7A7B9
9393A0

Deuteranopia

F3F4DD
D9DAC8
CACAC1
A5A2B9
9290A0

Tritanopia

F6E0E0
DCCBCC
CAC3C4
98BABA
8BA0A0

Achromatopsia

EDEDED
D5D5D5
C9C9C9
B1B1B1
999999

Shades & Tints Shades & Tints

#F7ECD6

Dark
Light

#DCD5C3

Dark
Light

#CACBBD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7ecd6;
  --color-2: #dcd5c3;
  --color-3: #cacbbd;
  --color-4: #96bdb8;
  --color-5: #8a9fa0;
}

SCSS

$color-1: #f7ecd6;
$color-2: #dcd5c3;
$color-3: #cacbbd;
$color-4: #96bdb8;
$color-5: #8a9fa0;

TAILWIND

colors: {
  'brand-1': '#f7ecd6',
  'brand-2': '#dcd5c3',
  'brand-3': '#cacbbd',
  'brand-4': '#96bdb8',
  'brand-5': '#8a9fa0',
}

RGB Array

[247, 236, 214], [220, 213, 195], [202, 203, 189], [150, 189, 184], [138, 159, 160]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F7ECD6, #DCD5C3, #CACBBD, #96BDB8, #8A9FA0 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: #f7ecd6; --color-2: #dcd5c3; --color-3: #cacbbd; --color-4: #96bdb8; --color-5: #8a9fa0. 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