← Back to Editor

#CBD6D0 · #C2B0B6 · #CC7281 · #B44659 · #754856

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#CBD6D0

Celadon · LightGray · Mint Green

HEX
#CBD6D0
RGB
rgb(203, 214, 208)
HSL
hsl(147, 12%, 82%)
HSB
hsb(147, 5%, 84%)
CMYK
cmyk(5%, 0%, 3%, 16%)
Oklch
oklch(86.6% 0.014 162.4)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#C2B0B6

Rouge · Silver · Rose Pink

HEX
#C2B0B6
RGB
rgb(194, 176, 182)
HSL
hsl(340, 13%, 73%)
HSB
hsb(340, 9%, 76%)
CMYK
cmyk(0%, 9%, 6%, 24%)
Oklch
oklch(77.4% 0.022 355.4)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#CC7281

Peach Pink · LightCoral · Coral Red

HEX
#CC7281
RGB
rgb(204, 114, 129)
HSL
hsl(350, 47%, 62%)
HSB
hsb(350, 44%, 80%)
CMYK
cmyk(0%, 44%, 37%, 20%)
Oklch
oklch(65.6% 0.114 10.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#B44659

Crimson · Sienna · Passion Red

HEX
#B44659
RGB
rgb(180, 70, 89)
HSL
hsl(350, 44%, 49%)
HSB
hsb(350, 61%, 71%)
CMYK
cmyk(0%, 61%, 51%, 29%)
Oklch
oklch(54.7% 0.143 12.7)

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

#754856

Dark Violet · DimGray · Camellia

HEX
#754856
RGB
rgb(117, 72, 86)
HSL
hsl(341, 24%, 37%)
HSB
hsb(341, 38%, 46%)
CMYK
cmyk(0%, 38%, 26%, 54%)
Oklch
oklch(45.8% 0.064 359.8)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBD6D0
D7CCD2

Analogous

CCD7CC
CBD6D0
CCD7D6

Triadic

CBD6D0
D1CCD7
D7D1CC

Split-Comp.

CBD6D0
D6CCD7
D7CCCC

Tetradic

CBD6D0
CCCCD7
D7CCD2
D7D6CC

Contrast Matrix WCAG 2.1 Contrast

CBD6D0
C2B0B6
CC7281
B44659
754856
—
1.4
Fail
2.2
Fail
3.6
AA Large
5.0
AA
1.4
Fail
—
1.6
Fail
2.6
Fail
3.6
AA Large
2.2
Fail
1.6
Fail
—
1.6
Fail
2.2
Fail
3.6
AA Large
2.6
Fail
1.6
Fail
—
1.4
Fail
5.0
AA
3.6
AA Large
2.2
Fail
1.4
Fail
—
White BG
1.5Fail
2.1Fail
3.3AA Large
5.3AA
7.5AAA
Black BG
14.1AAA
10.2AAA
6.3AA
4.0AA Large
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D0D0D1
BABAB5
A5A47D
848354
626153

Deuteranopia

CFCED2
BBBDB4
AAB17D
8B9353
646752

Tritanopia

CCD3D3
C1B3B3
C77B7A
AF5150
73504F

Achromatopsia

D2D2D2
B6B6B6
8F8F8F
696969
575757

Shades & Tints Shades & Tints

#CBD6D0

Dark
Light

#C2B0B6

Dark
Light

#CC7281

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbd6d0;
  --color-2: #c2b0b6;
  --color-3: #cc7281;
  --color-4: #b44659;
  --color-5: #754856;
}

SCSS

$color-1: #cbd6d0;
$color-2: #c2b0b6;
$color-3: #cc7281;
$color-4: #b44659;
$color-5: #754856;

TAILWIND

colors: {
  'brand-1': '#cbd6d0',
  'brand-2': '#c2b0b6',
  'brand-3': '#cc7281',
  'brand-4': '#b44659',
  'brand-5': '#754856',
}

RGB Array

[203, 214, 208], [194, 176, 182], [204, 114, 129], [180, 70, 89], [117, 72, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CBD6D0, #C2B0B6, #CC7281, #B44659, #754856 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: #cbd6d0; --color-2: #c2b0b6; --color-3: #cc7281; --color-4: #b44659; --color-5: #754856. 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