← Back to Editor

#C0D5C5 · #320337 · #540937 · #8C103A · #BBD1AF

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

#C0D5C5

Celadon · Silver · Apple Green

HEX
#C0D5C5
RGB
rgb(192, 213, 197)
HSL
hsl(134, 20%, 79%)
HSB
hsb(134, 10%, 84%)
CMYK
cmyk(10%, 0%, 8%, 16%)
Oklch
oklch(85.3% 0.031 152.8)

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

#320337

Royal Purple · MidnightBlue · Dark Purple

HEX
#320337
RGB
rgb(50, 3, 55)
HSL
hsl(294, 90%, 11%)
HSB
hsb(294, 95%, 22%)
CMYK
cmyk(9%, 95%, 0%, 78%)
Oklch
oklch(23.0% 0.101 323.8)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#540937

Rose Purple · Maroon · Raspberry

HEX
#540937
RGB
rgb(84, 9, 55)
HSL
hsl(323, 81%, 18%)
HSB
hsb(323, 89%, 33%)
CMYK
cmyk(0%, 89%, 35%, 67%)
Oklch
oklch(30.2% 0.115 349.2)

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

#8C103A

Dark Violet · Brown · Camellia

HEX
#8C103A
RGB
rgb(140, 16, 58)
HSL
hsl(340, 79%, 31%)
HSB
hsb(340, 89%, 55%)
CMYK
cmyk(0%, 89%, 59%, 45%)
Oklch
oklch(41.7% 0.156 9.1)

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

#BBD1AF

Celadon · Silver · Apple Green

HEX
#BBD1AF
RGB
rgb(187, 209, 175)
HSL
hsl(99, 27%, 75%)
HSB
hsb(99, 16%, 82%)
CMYK
cmyk(11%, 0%, 16%, 18%)
Oklch
oklch(83.5% 0.052 134.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C0D5C5
D4BFCF

Analogous

C4D4BF
C0D5C5
BFD4CE

Triadic

C0D5C5
C4BFD4
D4C4BF

Split-Comp.

C0D5C5
CEBFD4
D4BFC4

Tetradic

C0D5C5
BFC4D4
D4BFCF
D4CEBF

Contrast Matrix WCAG 2.1 Contrast

C0D5C5
320337
540937
8C103A
BBD1AF
—
11.3
AAA
9.2
AAA
6.0
AA
1.1
Fail
11.3
AAA
—
1.2
Fail
1.9
Fail
10.7
AAA
9.2
AAA
1.2
Fail
—
1.5
Fail
8.7
AAA
6.0
AA
1.9
Fail
1.5
Fail
—
5.7
AA
1.1
Fail
10.7
AAA
8.7
AAA
5.7
AA
—
White BG
1.5Fail
17.4AAA
14.3AAA
9.3AAA
1.6Fail
Black BG
13.6AAA
1.2Fail
1.5Fail
2.3Fail
12.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C9C9
1E1D2A
34332C
565530
C5C5B7

Deuteranopia

C8C6CA
202427
383E29
5E672D
C3C2B9

Tritanopia

C1CCCD
30201E
502321
862826
BCBEBF

Achromatopsia

CDCDCD
171717
252525
3A3A3A
C7C7C7

Shades & Tints Shades & Tints

#C0D5C5

Dark
Light

#320337

Dark
Light

#540937

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c0d5c5;
  --color-2: #320337;
  --color-3: #540937;
  --color-4: #8c103a;
  --color-5: #bbd1af;
}

SCSS

$color-1: #c0d5c5;
$color-2: #320337;
$color-3: #540937;
$color-4: #8c103a;
$color-5: #bbd1af;

TAILWIND

colors: {
  'brand-1': '#c0d5c5',
  'brand-2': '#320337',
  'brand-3': '#540937',
  'brand-4': '#8c103a',
  'brand-5': '#bbd1af',
}

RGB Array

[192, 213, 197], [50, 3, 55], [84, 9, 55], [140, 16, 58], [187, 209, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C0D5C5, #320337, #540937, #8C103A, #BBD1AF 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: #c0d5c5; --color-2: #320337; --color-3: #540937; --color-4: #8c103a; --color-5: #bbd1af. 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