← Back to Editor

#D66B6B · #402B2B · #C4BCBC · #6B756F · #B8DBCA

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 LibraryData Visualization

Color Details Color Details

#D66B6B

Peach Pink · LightCoral · Coral Red

HEX
#D66B6B
RGB
rgb(214, 107, 107)
HSL
hsl(0, 57%, 63%)
HSB
hsb(0, 50%, 84%)
CMYK
cmyk(0%, 50%, 50%, 16%)
Oklch
oklch(65.3% 0.135 21.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#402B2B

Crimson · DarkSlateGray · Wine Red

HEX
#402B2B
RGB
rgb(64, 43, 43)
HSL
hsl(0, 20%, 21%)
HSB
hsb(0, 33%, 25%)
CMYK
cmyk(0%, 33%, 33%, 75%)
Oklch
oklch(31.4% 0.031 19.0)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#C4BCBC

Silver Gray · Silver · Pearl Gray

HEX
#C4BCBC
RGB
rgb(196, 188, 188)
HSL
hsl(0, 6%, 75%)
HSB
hsb(0, 4%, 77%)
CMYK
cmyk(0%, 4%, 4%, 23%)
Oklch
oklch(80.2% 0.009 17.3)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#6B756F

Ink Gray · DimGray · Warm Gray

HEX
#6B756F
RGB
rgb(107, 117, 111)
HSL
hsl(144, 4%, 44%)
HSB
hsb(144, 9%, 46%)
CMYK
cmyk(9%, 0%, 5%, 54%)
Oklch
oklch(55.2% 0.015 159.6)

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

#B8DBCA

Jade · LightGray · Apple Green

HEX
#B8DBCA
RGB
rgb(184, 219, 202)
HSL
hsl(151, 33%, 79%)
HSB
hsb(151, 16%, 86%)
CMYK
cmyk(16%, 0%, 8%, 14%)
Oklch
oklch(86.1% 0.044 164.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D66B6B
6BD6D6

Analogous

D66BA1
D66B6B
D6A16B

Triadic

D66B6B
6BD66B
6B6BD6

Split-Comp.

D66B6B
6BD6A1
6BA1D6

Tetradic

D66B6B
A1D66B
6BD6D6
A16BD6

Contrast Matrix WCAG 2.1 Contrast

D66B6B
402B2B
C4BCBC
6B756F
B8DBCA
—
3.9
AA Large
1.8
Fail
1.4
Fail
2.3
Fail
3.9
AA Large
—
7.0
AAA
2.8
Fail
8.8
AAA
1.8
Fail
7.0
AAA
—
2.6
Fail
1.2
Fail
1.4
Fail
2.8
Fail
2.6
Fail
—
3.2
AA Large
2.3
Fail
8.8
AAA
1.2
Fail
3.2
AA Large
—
White BG
3.4AA Large
13.1AAA
1.9Fail
4.8AA
1.5Fail
Black BG
6.2AA
1.6Fail
11.3AAA
4.4AA Large
14.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A8A76B
37372B
C1C0BC
6F6F70
C7C7CE

Deuteranopia

AEB66B
383A2B
C1C2BC
6F6E71
C5C3CF

Tritanopia

D16B6B
3F2B2B
C4BCBC
6B7272
BAD1D2

Achromatopsia

8B8B8B
313131
BEBEBE
717171
CFCFCF

Shades & Tints Shades & Tints

#D66B6B

Dark
Light

#402B2B

Dark
Light

#C4BCBC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d66b6b;
  --color-2: #402b2b;
  --color-3: #c4bcbc;
  --color-4: #6b756f;
  --color-5: #b8dbca;
}

SCSS

$color-1: #d66b6b;
$color-2: #402b2b;
$color-3: #c4bcbc;
$color-4: #6b756f;
$color-5: #b8dbca;

TAILWIND

colors: {
  'brand-1': '#d66b6b',
  'brand-2': '#402b2b',
  'brand-3': '#c4bcbc',
  'brand-4': '#6b756f',
  'brand-5': '#b8dbca',
}

RGB Array

[214, 107, 107], [64, 43, 43], [196, 188, 188], [107, 117, 111], [184, 219, 202]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D66B6B, #402B2B, #C4BCBC, #6B756F, #B8DBCA is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #d66b6b; --color-2: #402b2b; --color-3: #c4bcbc; --color-4: #6b756f; --color-5: #b8dbca. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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