← Back to Editor

#D8CBC0 · #9CB2B1 · #78A69C · #2D95E5 · #6C6B71

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D8CBC0

Apricot · LightGray · Peach Orange

HEX
#D8CBC0
RGB
rgb(216, 203, 192)
HSL
hsl(27, 24%, 80%)
HSB
hsb(27, 11%, 85%)
CMYK
cmyk(0%, 6%, 11%, 15%)
Oklch
oklch(85.0% 0.021 62.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#9CB2B1

Jade · DarkGray · Lake Green

HEX
#9CB2B1
RGB
rgb(156, 178, 177)
HSL
hsl(177, 12%, 65%)
HSB
hsb(177, 12%, 70%)
CMYK
cmyk(12%, 0%, 1%, 30%)
Oklch
oklch(74.6% 0.024 193.3)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#78A69C

Mineral Blue · CadetBlue · Lake Green

HEX
#78A69C
RGB
rgb(120, 166, 156)
HSL
hsl(167, 21%, 56%)
HSB
hsb(167, 28%, 65%)
CMYK
cmyk(28%, 0%, 6%, 35%)
Oklch
oklch(68.9% 0.052 179.7)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#2D95E5

Lake Blue · DodgerBlue · Navy Blue

HEX
#2D95E5
RGB
rgb(45, 149, 229)
HSL
hsl(206, 78%, 54%)
HSB
hsb(206, 80%, 90%)
CMYK
cmyk(80%, 35%, 0%, 10%)
Oklch
oklch(65.0% 0.151 246.8)

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

#6C6B71

Ink Gray · DimGray · Warm Gray

HEX
#6C6B71
RGB
rgb(108, 107, 113)
HSL
hsl(250, 3%, 43%)
HSB
hsb(250, 5%, 44%)
CMYK
cmyk(4%, 5%, 0%, 56%)
Oklch
oklch(53.1% 0.009 293.7)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8CBC0
C0CDD8

Analogous

D8C0C1
D8CBC0
D8D7C0

Triadic

D8CBC0
C0D8CB
CBC0D8

Split-Comp.

D8CBC0
C0D8D7
C0C1D8

Tetradic

D8CBC0
C1D8C0
C0CDD8
D7C0D8

Contrast Matrix WCAG 2.1 Contrast

D8CBC0
9CB2B1
78A69C
2D95E5
6C6B71
—
1.4
Fail
1.7
Fail
2.0
Fail
3.3
AA Large
1.4
Fail
—
1.2
Fail
1.4
Fail
2.4
Fail
1.7
Fail
1.2
Fail
—
1.2
Fail
1.9
Fail
2.0
Fail
1.4
Fail
1.2
Fail
—
1.6
Fail
3.3
AA Large
2.4
Fail
1.9
Fail
1.6
Fail
—
White BG
1.6Fail
2.2Fail
2.7Fail
3.2AA Large
5.3AA
Black BG
13.2AAA
9.4AAA
7.7AAA
6.5AA
4.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D2D2C3
A6A6B1
8C8C9E
5A5BD2
6C6C70

Deuteranopia

D3D4C3
A4A3B1
89869F
544CCD
6C6C6F

Tritanopia

D7C5C5
9DB1B1
7AA0A1
32C2BF
6C6E6E

Achromatopsia

CECECE
ABABAB
979797
7F7F7F
6C6C6C

Shades & Tints Shades & Tints

#D8CBC0

Dark
Light

#9CB2B1

Dark
Light

#78A69C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8cbc0;
  --color-2: #9cb2b1;
  --color-3: #78a69c;
  --color-4: #2d95e5;
  --color-5: #6c6b71;
}

SCSS

$color-1: #d8cbc0;
$color-2: #9cb2b1;
$color-3: #78a69c;
$color-4: #2d95e5;
$color-5: #6c6b71;

TAILWIND

colors: {
  'brand-1': '#d8cbc0',
  'brand-2': '#9cb2b1',
  'brand-3': '#78a69c',
  'brand-4': '#2d95e5',
  'brand-5': '#6c6b71',
}

RGB Array

[216, 203, 192], [156, 178, 177], [120, 166, 156], [45, 149, 229], [108, 107, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D8CBC0, #9CB2B1, #78A69C, #2D95E5, #6C6B71 is ideal for: brand design, premium product pages, magazine layouts. 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: #d8cbc0; --color-2: #9cb2b1; --color-3: #78a69c; --color-4: #2d95e5; --color-5: #6c6b71. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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. 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