← Back to Editor

#C8D8D7 · #F2D9D6 · #D8D2C8 · #958879 · #F3E795

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

#C8D8D7

Jade · LightGray · Glacier Blue

HEX
#C8D8D7
RGB
rgb(200, 216, 215)
HSL
hsl(176, 17%, 82%)
HSB
hsb(176, 7%, 85%)
CMYK
cmyk(7%, 0%, 0%, 15%)
Oklch
oklch(87.0% 0.017 192.3)

TraditionalJade」· PaintGlacier Blue」· Creative Arctic Pool

#F2D9D6

Peach Pink · Bisque · Cherry Blossom

HEX
#F2D9D6
RGB
rgb(242, 217, 214)
HSL
hsl(6, 52%, 89%)
HSB
hsb(6, 12%, 95%)
CMYK
cmyk(0%, 10%, 12%, 5%)
Oklch
oklch(90.5% 0.028 25.9)

TraditionalPeach Pink」· PaintCherry Blossom」· Creative Blush Sunrise

#D8D2C8

Goose Yellow · LightGray · Peach Orange

HEX
#D8D2C8
RGB
rgb(216, 210, 200)
HSL
hsl(37, 17%, 82%)
HSB
hsb(37, 7%, 85%)
CMYK
cmyk(0%, 3%, 7%, 15%)
Oklch
oklch(86.6% 0.015 80.7)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#958879

Ginger · Gray · Warm Sun

HEX
#958879
RGB
rgb(149, 136, 121)
HSL
hsl(32, 12%, 53%)
HSB
hsb(32, 19%, 58%)
CMYK
cmyk(0%, 9%, 19%, 42%)
Oklch
oklch(63.4% 0.027 71.3)

TraditionalGinger」· PaintWarm Sun」· Creative Blush Sunrise

#F3E795

Fresh Green · Khaki · Lemon Cream

HEX
#F3E795
RGB
rgb(243, 231, 149)
HSL
hsl(52, 80%, 77%)
HSB
hsb(52, 39%, 95%)
CMYK
cmyk(0%, 5%, 39%, 5%)
Oklch
oklch(91.9% 0.103 101.0)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C8D8D7
D9C9CA

Analogous

C9D9D0
C8D8D7
C9D2D9

Triadic

C8D8D7
D8C9D9
D9D8C9

Split-Comp.

C8D8D7
D9C9D2
D9D0C9

Tetradic

C8D8D7
D0C9D9
D9C9CA
D2D9C9

Contrast Matrix WCAG 2.1 Contrast

C8D8D7
F2D9D6
D8D2C8
958879
F3E795
1.1
Fail
1.0
Fail
2.3
Fail
1.2
Fail
1.1
Fail
1.1
Fail
2.6
Fail
1.1
Fail
1.0
Fail
1.1
Fail
2.3
Fail
1.2
Fail
2.3
Fail
2.6
Fail
2.3
Fail
2.7
Fail
1.2
Fail
1.1
Fail
1.2
Fail
2.7
Fail
White BG
1.5Fail
1.3Fail
1.5Fail
3.5AA Large
1.3Fail
Black BG
14.3AAA
15.7AAA
14.0AAA
6.1AA
16.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCFD7
E7E7D7
D5D5CA
8F8F7D
EEEEA9

Deuteranopia

CECDD7
E9EAD7
D6D6CB
90917D
EFEFAE

Tritanopia

C9D7D7
F1D7D7
D8CCCD
947F80
F2B9BC

Achromatopsia

D3D3D3
E0E0E0
D3D3D3
8A8A8A
E1E1E1

Shades & Tints Shades & Tints

#C8D8D7

Dark
Light

#F2D9D6

Dark
Light

#D8D2C8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c8d8d7;
  --color-2: #f2d9d6;
  --color-3: #d8d2c8;
  --color-4: #958879;
  --color-5: #f3e795;
}

SCSS

$color-1: #c8d8d7;
$color-2: #f2d9d6;
$color-3: #d8d2c8;
$color-4: #958879;
$color-5: #f3e795;

TAILWIND

colors: {
  'brand-1': '#c8d8d7',
  'brand-2': '#f2d9d6',
  'brand-3': '#d8d2c8',
  'brand-4': '#958879',
  'brand-5': '#f3e795',
}

RGB Array

[200, 216, 215], [242, 217, 214], [216, 210, 200], [149, 136, 121], [243, 231, 149]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C8D8D7, #F2D9D6, #D8D2C8, #958879, #F3E795 is ideal for: health products, baby brands, fresh-style blogs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c8d8d7; --color-2: #f2d9d6; --color-3: #d8d2c8; --color-4: #958879; --color-5: #f3e795. 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 tech, SaaS, healthcare, eco industries. 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