← Back to Editor

#8CB9B3 · #CDE1DF · #804D64 · #5B214A · #BBBE25

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

#8CB9B3

Jade · DarkGray · Lake Green

HEX
#8CB9B3
RGB
rgb(140, 185, 179)
HSL
hsl(172, 24%, 64%)
HSB
hsb(172, 24%, 73%)
CMYK
cmyk(24%, 0%, 3%, 27%)
Oklch
oklch(75.2% 0.049 186.1)

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

#CDE1DF

Jade · LightGray · Glacier Blue

HEX
#CDE1DF
RGB
rgb(205, 225, 223)
HSL
hsl(174, 25%, 84%)
HSB
hsb(174, 9%, 88%)
CMYK
cmyk(9%, 0%, 1%, 12%)
Oklch
oklch(89.4% 0.021 189.5)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#804D64

Dark Violet · DimGray · Camellia

HEX
#804D64
RGB
rgb(128, 77, 100)
HSL
hsl(333, 25%, 40%)
HSB
hsb(333, 40%, 50%)
CMYK
cmyk(0%, 40%, 22%, 50%)
Oklch
oklch(48.6% 0.075 351.7)

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

#5B214A

Rose Purple · DarkSlateGray · Eggplant

HEX
#5B214A
RGB
rgb(91, 33, 74)
HSL
hsl(318, 47%, 24%)
HSB
hsb(318, 64%, 36%)
CMYK
cmyk(0%, 64%, 19%, 64%)
Oklch
oklch(35.0% 0.100 340.6)

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

#BBBE25

Autumn Sage · GoldenRod · Honey Gold

HEX
#BBBE25
RGB
rgb(187, 190, 37)
HSL
hsl(61, 67%, 45%)
HSB
hsb(61, 81%, 75%)
CMYK
cmyk(2%, 0%, 81%, 25%)
Oklch
oklch(77.4% 0.161 110.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8CB9B3
B98D93

Analogous

8DB99D
8CB9B3
8DA9B9

Triadic

8CB9B3
B38DB9
B9B38D

Split-Comp.

8CB9B3
B98DA9
B99D8D

Tetradic

8CB9B3
9D8DB9
B98D93
A9B98D

Contrast Matrix WCAG 2.1 Contrast

8CB9B3
CDE1DF
804D64
5B214A
BBBE25
—
1.6
Fail
3.1
AA Large
5.5
AA
1.1
Fail
1.6
Fail
—
4.9
AA
8.8
AAA
1.5
Fail
3.1
AA Large
4.9
AA
—
1.8
Fail
3.3
AA Large
5.5
AA
8.8
AAA
1.8
Fail
—
6.0
AA
1.1
Fail
1.5
Fail
3.3
AA Large
6.0
AA
—
White BG
2.2Fail
1.4Fail
6.6AA
11.9AAA
2.0Fail
Black BG
9.7AAA
15.4AAA
3.2AA Large
1.8Fail
10.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9FA0B4
D6D6DF
6A695E
424140
BCBC4A

Deuteranopia

9D9AB5
D5D3E0
6D715D
454A3E
BCBC53

Tritanopia

8EB6B6
CEE0E0
7D5A59
583837
BB676E

Achromatopsia

ABABAB
DBDBDB
5F5F5F
373737
ACACAC

Shades & Tints Shades & Tints

#8CB9B3

Dark
Light

#CDE1DF

Dark
Light

#804D64

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8cb9b3;
  --color-2: #cde1df;
  --color-3: #804d64;
  --color-4: #5b214a;
  --color-5: #bbbe25;
}

SCSS

$color-1: #8cb9b3;
$color-2: #cde1df;
$color-3: #804d64;
$color-4: #5b214a;
$color-5: #bbbe25;

TAILWIND

colors: {
  'brand-1': '#8cb9b3',
  'brand-2': '#cde1df',
  'brand-3': '#804d64',
  'brand-4': '#5b214a',
  'brand-5': '#bbbe25',
}

RGB Array

[140, 185, 179], [205, 225, 223], [128, 77, 100], [91, 33, 74], [187, 190, 37]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8CB9B3, #CDE1DF, #804D64, #5B214A, #BBBE25 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #8cb9b3; --color-2: #cde1df; --color-3: #804d64; --color-4: #5b214a; --color-5: #bbbe25. 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. 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