← Back to Editor

#CC807C · #C49693 · #BDB9B9 · #BCCCCB · #C8DEDC

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

#CC807C

Peach Pink · LightCoral · Coral Red

HEX
#CC807C
RGB
rgb(204, 128, 124)
HSL
hsl(3, 44%, 64%)
HSB
hsb(3, 39%, 80%)
CMYK
cmyk(0%, 37%, 39%, 20%)
Oklch
oklch(67.8% 0.095 23.1)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#C49693

Peach Pink · Tan · Coral Red

HEX
#C49693
RGB
rgb(196, 150, 147)
HSL
hsl(4, 29%, 67%)
HSB
hsb(4, 25%, 77%)
CMYK
cmyk(0%, 23%, 25%, 23%)
Oklch
oklch(71.5% 0.056 22.8)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#BDB9B9

Silver Gray · Silver · Pearl Gray

HEX
#BDB9B9
RGB
rgb(189, 185, 185)
HSL
hsl(0, 3%, 73%)
HSB
hsb(0, 2%, 74%)
CMYK
cmyk(0%, 2%, 2%, 26%)
Oklch
oklch(78.9% 0.005 17.3)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

#BCCCCB

Jade · Silver · Glacier Blue

HEX
#BCCCCB
RGB
rgb(188, 204, 203)
HSL
hsl(176, 14%, 77%)
HSB
hsb(176, 8%, 80%)
CMYK
cmyk(8%, 0%, 0%, 20%)
Oklch
oklch(83.3% 0.017 192.3)

TraditionalJade」· PaintGlacier Blue」· Creative Arctic Pool

#C8DEDC

Jade · LightGray · Glacier Blue

HEX
#C8DEDC
RGB
rgb(200, 222, 220)
HSL
hsl(175, 25%, 83%)
HSB
hsb(175, 10%, 87%)
CMYK
cmyk(10%, 0%, 1%, 13%)
Oklch
oklch(88.4% 0.024 190.1)

TraditionalJade」· PaintGlacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CC807C
7BC8CC

Analogous

CC7B9F
CC807C
CCA77B

Triadic

CC807C
7BCC7F
7F7BCC

Split-Comp.

CC807C
7BCCA7
7B9FCC

Tetradic

CC807C
9FCC7B
7BC8CC
A77BCC

Contrast Matrix WCAG 2.1 Contrast

CC807C
C49693
BDB9B9
BCCCCB
C8DEDC
1.2
Fail
1.6
Fail
1.8
Fail
2.2
Fail
1.2
Fail
1.3
Fail
1.6
Fail
1.8
Fail
1.6
Fail
1.3
Fail
1.2
Fail
1.4
Fail
1.8
Fail
1.6
Fail
1.2
Fail
1.2
Fail
2.2
Fail
1.8
Fail
1.4
Fail
1.2
Fail
White BG
3.0AA Large
2.6Fail
1.9Fail
1.7Fail
1.4Fail
Black BG
6.9AA
8.1AAA
10.8AAA
12.6AAA
14.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ABAA7D
B0B094
BBBBB9
C3C3CB
D2D2DC

Deuteranopia

B0B57D
B3B694
BCBCB9
C2C1CB
D0CFDD

Tritanopia

C87E7E
C29494
BDB9B9
BDCBCB
C9DDDD

Achromatopsia

969696
A3A3A3
BABABA
C7C7C7
D7D7D7

Shades & Tints Shades & Tints

#CC807C

Dark
Light

#C49693

Dark
Light

#BDB9B9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cc807c;
  --color-2: #c49693;
  --color-3: #bdb9b9;
  --color-4: #bccccb;
  --color-5: #c8dedc;
}

SCSS

$color-1: #cc807c;
$color-2: #c49693;
$color-3: #bdb9b9;
$color-4: #bccccb;
$color-5: #c8dedc;

TAILWIND

colors: {
  'brand-1': '#cc807c',
  'brand-2': '#c49693',
  'brand-3': '#bdb9b9',
  'brand-4': '#bccccb',
  'brand-5': '#c8dedc',
}

RGB Array

[204, 128, 124], [196, 150, 147], [189, 185, 185], [188, 204, 203], [200, 222, 220]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CC807C, #C49693, #BDB9B9, #BCCCCB, #C8DEDC 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: #cc807c; --color-2: #c49693; --color-3: #bdb9b9; --color-4: #bccccb; --color-5: #c8dedc. 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