← Back to Editor

#332F3B · #D84C4C · #E68475 · #CAECBC · #B0E8E2

space

A 5-color space 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

#332F3B

Deep Indigo · DarkSlateGray · Eggplant

HEX
#332F3B
RGB
rgb(51, 47, 59)
HSL
hsl(260, 11%, 21%)
HSB
hsb(260, 20%, 23%)
CMYK
cmyk(14%, 20%, 0%, 77%)
Oklch
oklch(31.4% 0.022 300.4)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#D84C4C

Vermilion · Tomato · Passion Red

HEX
#D84C4C
RGB
rgb(216, 76, 76)
HSL
hsl(0, 64%, 57%)
HSB
hsb(0, 65%, 85%)
CMYK
cmyk(0%, 65%, 65%, 15%)
Oklch
oklch(60.9% 0.176 24.0)

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

#E68475

Peach Pink · LightCoral · Coral Red

HEX
#E68475
RGB
rgb(230, 132, 117)
HSL
hsl(8, 69%, 68%)
HSB
hsb(8, 49%, 90%)
CMYK
cmyk(0%, 43%, 49%, 10%)
Oklch
oklch(71.6% 0.123 29.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#CAECBC

Emerald · LightGray · Mint Green

HEX
#CAECBC
RGB
rgb(202, 236, 188)
HSL
hsl(103, 56%, 83%)
HSB
hsb(103, 20%, 93%)
CMYK
cmyk(14%, 0%, 20%, 7%)
Oklch
oklch(90.6% 0.073 136.6)

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

#B0E8E2

Jade · LightBlue · Glacier Blue

HEX
#B0E8E2
RGB
rgb(176, 232, 226)
HSL
hsl(174, 55%, 80%)
HSB
hsb(174, 24%, 91%)
CMYK
cmyk(24%, 0%, 3%, 9%)
Oklch
oklch(89.1% 0.058 188.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

332F3B
383B30

Analogous

30323B
332F3B
39303B

Triadic

332F3B
3B3430
303B34

Split-Comp.

332F3B
3B3930
323B30

Tetradic

332F3B
3B3032
383B30
303B39

Contrast Matrix WCAG 2.1 Contrast

332F3B
D84C4C
E68475
CAECBC
B0E8E2
—
3.1
AA Large
4.9
AA
10.1
AAA
9.6
AAA
3.1
AA Large
—
1.6
Fail
3.2
AA Large
3.1
AA Large
4.9
AA
1.6
Fail
—
2.0
Fail
2.0
Fail
10.1
AAA
3.2
AA Large
2.0
Fail
—
1.0
Fail
9.6
AAA
3.1
AA Large
2.0
Fail
1.0
Fail
—
White BG
13.0AAA
4.2AA Large
2.7Fail
1.3Fail
1.4Fail
Black BG
1.6Fail
5.1AA
7.9AAA
16.2AAA
15.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

313138
9B9A4C
BCBB79
D9D9C8
C8C9E3

Deuteranopia

323237
A4AE4C
C1C97A
D7D4CA
C5C1E4

Tritanopia

333635
D14C4C
E17B7C
CCD1D3
B3E5E5

Achromatopsia

323232
767676
A0A0A0
DCDCDC
D7D7D7

Shades & Tints Shades & Tints

#332F3B

Dark
Light

#D84C4C

Dark
Light

#E68475

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #332f3b;
  --color-2: #d84c4c;
  --color-3: #e68475;
  --color-4: #caecbc;
  --color-5: #b0e8e2;
}

SCSS

$color-1: #332f3b;
$color-2: #d84c4c;
$color-3: #e68475;
$color-4: #caecbc;
$color-5: #b0e8e2;

TAILWIND

colors: {
  'brand-1': '#332f3b',
  'brand-2': '#d84c4c',
  'brand-3': '#e68475',
  'brand-4': '#caecbc',
  'brand-5': '#b0e8e2',
}

RGB Array

[51, 47, 59], [216, 76, 76], [230, 132, 117], [202, 236, 188], [176, 232, 226]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #332F3B, #D84C4C, #E68475, #CAECBC, #B0E8E2 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: #332f3b; --color-2: #d84c4c; --color-3: #e68475; --color-4: #caecbc; --color-5: #b0e8e2. 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 space-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