← Back to Editor

#CDE9CA · #BDE0BA · #9DBDB5 · #947C93 · #524451

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

#CDE9CA

Celadon · LightGray · Mint Green

HEX
#CDE9CA
RGB
rgb(205, 233, 202)
HSL
hsl(114, 41%, 85%)
HSB
hsb(114, 13%, 91%)
CMYK
cmyk(12%, 0%, 13%, 9%)
Oklch
oklch(90.5% 0.051 142.5)

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

#BDE0BA

Celadon · Silver · Apple Green

HEX
#BDE0BA
RGB
rgb(189, 224, 186)
HSL
hsl(115, 38%, 80%)
HSB
hsb(115, 17%, 88%)
CMYK
cmyk(16%, 0%, 17%, 12%)
Oklch
oklch(87.1% 0.063 142.9)

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

#9DBDB5

Jade · DarkGray · Lake Green

HEX
#9DBDB5
RGB
rgb(157, 189, 181)
HSL
hsl(165, 20%, 68%)
HSB
hsb(165, 17%, 74%)
CMYK
cmyk(17%, 0%, 4%, 26%)
Oklch
oklch(77.2% 0.036 178.5)

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

#947C93

Rose Purple · Gray · Violet

HEX
#947C93
RGB
rgb(148, 124, 147)
HSL
hsl(303, 10%, 53%)
HSB
hsb(303, 16%, 58%)
CMYK
cmyk(0%, 16%, 1%, 42%)
Oklch
oklch(61.6% 0.044 327.4)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

#524451

Rose Purple · DarkSlateGray · Charcoal

HEX
#524451
RGB
rgb(82, 68, 81)
HSL
hsl(304, 9%, 29%)
HSB
hsb(304, 17%, 32%)
CMYK
cmyk(0%, 17%, 1%, 68%)
Oklch
oklch(40.6% 0.028 328.4)

Traditional「Rose Purple」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CDE9CA
E5C9E8

Analogous

DCE8C9
CDE9CA
C9E8D6

Triadic

CDE9CA
C9CCE8
E8C9CC

Split-Comp.

CDE9CA
D6C9E8
E8C9DC

Tetradic

CDE9CA
C9DCE8
E5C9E8
E8D6C9

Contrast Matrix WCAG 2.1 Contrast

CDE9CA
BDE0BA
9DBDB5
947C93
524451
—
1.1
Fail
1.6
Fail
2.9
Fail
7.0
AA
1.1
Fail
—
1.4
Fail
2.6
Fail
6.3
AA
1.6
Fail
1.4
Fail
—
1.9
Fail
4.5
AA
2.9
Fail
2.6
Fail
1.9
Fail
—
2.4
Fail
7.0
AA
6.3
AA
4.5
AA
2.4
Fail
—
White BG
1.3Fail
1.4Fail
2.0Fail
3.8AA Large
9.1AAA
Black BG
16.1AAA
14.5AAA
10.4AAA
5.6AA
2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D9D2
CCCCC3
ABABB7
8A898D
4C4C4E

Deuteranopia

D8D5D3
CAC8C5
A9A7B7
8B8D8C
4D4E4D

Tritanopia

CED7D9
BFCACC
9FB8B9
938988
514B4B

Achromatopsia

DDDDDD
D1D1D1
B3B3B3
868686
4A4A4A

Shades & Tints Shades & Tints

#CDE9CA

Dark
Light

#BDE0BA

Dark
Light

#9DBDB5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cde9ca;
  --color-2: #bde0ba;
  --color-3: #9dbdb5;
  --color-4: #947c93;
  --color-5: #524451;
}

SCSS

$color-1: #cde9ca;
$color-2: #bde0ba;
$color-3: #9dbdb5;
$color-4: #947c93;
$color-5: #524451;

TAILWIND

colors: {
  'brand-1': '#cde9ca',
  'brand-2': '#bde0ba',
  'brand-3': '#9dbdb5',
  'brand-4': '#947c93',
  'brand-5': '#524451',
}

RGB Array

[205, 233, 202], [189, 224, 186], [157, 189, 181], [148, 124, 147], [82, 68, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CDE9CA, #BDE0BA, #9DBDB5, #947C93, #524451 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: #cde9ca; --color-2: #bde0ba; --color-3: #9dbdb5; --color-4: #947c93; --color-5: #524451. 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