← Back to Editor

#352242 · #987C88 · #C54045 · #7CAF6D · #D8C6B2

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

#352242

Dark Plum · DarkSlateGray · Dark Purple

HEX
#352242
RGB
rgb(53, 34, 66)
HSL
hsl(276, 32%, 20%)
HSB
hsb(276, 48%, 26%)
CMYK
cmyk(20%, 48%, 0%, 74%)
Oklch
oklch(29.1% 0.061 310.4)

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

#987C88

Dark Violet · Gray · Rose Pink

HEX
#987C88
RGB
rgb(152, 124, 136)
HSL
hsl(334, 12%, 54%)
HSB
hsb(334, 18%, 60%)
CMYK
cmyk(0%, 18%, 11%, 40%)
Oklch
oklch(61.6% 0.038 350.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#C54045

Crimson · Brown · Passion Red

HEX
#C54045
RGB
rgb(197, 64, 69)
HSL
hsl(358, 53%, 51%)
HSB
hsb(358, 68%, 77%)
CMYK
cmyk(0%, 68%, 65%, 23%)
Oklch
oklch(56.3% 0.169 22.4)

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

#7CAF6D

Celadon · DarkSeaGreen · Olive Green

HEX
#7CAF6D
RGB
rgb(124, 175, 109)
HSL
hsl(106, 29%, 56%)
HSB
hsb(106, 38%, 69%)
CMYK
cmyk(29%, 0%, 38%, 31%)
Oklch
oklch(70.1% 0.108 138.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#D8C6B2

Goose Yellow · Silver · Peach Orange

HEX
#D8C6B2
RGB
rgb(216, 198, 178)
HSL
hsl(32, 33%, 77%)
HSB
hsb(32, 18%, 85%)
CMYK
cmyk(0%, 8%, 18%, 15%)
Oklch
oklch(83.6% 0.034 70.3)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

352242
304323

Analogous

262343
352242
432340

Triadic

352242
433623
234336

Split-Comp.

352242
404323
234326

Tetradic

352242
432623
304323
234043

Contrast Matrix WCAG 2.1 Contrast

352242
987C88
C54045
7CAF6D
D8C6B2
—
3.8
AA Large
2.9
Fail
5.6
AA
8.7
AAA
3.8
AA Large
—
1.3
Fail
1.5
Fail
2.3
Fail
2.9
Fail
1.3
Fail
—
2.0
Fail
3.0
AA Large
5.6
AA
1.5
Fail
2.0
Fail
—
1.5
Fail
8.7
AAA
2.3
Fail
3.0
AA Large
1.5
Fail
—
White BG
14.4AAA
3.8AA Large
5.0AA
2.6Fail
1.7Fail
Black BG
1.5Fail
5.6AA
4.2AA Large
8.2AAA
12.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2D2D3A
8C8C85
8B8A44
92937D
D0D0B7

Deuteranopia

2E2F38
8E9084
939D44
8F8B81
D1D3B8

Tritanopia

343433
978382
BE4343
7F8A8C
D7BBBC

Achromatopsia

2B2B2B
868686
686868
989898
C9C9C9

Shades & Tints Shades & Tints

#352242

Dark
Light

#987C88

Dark
Light

#C54045

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #352242;
  --color-2: #987c88;
  --color-3: #c54045;
  --color-4: #7caf6d;
  --color-5: #d8c6b2;
}

SCSS

$color-1: #352242;
$color-2: #987c88;
$color-3: #c54045;
$color-4: #7caf6d;
$color-5: #d8c6b2;

TAILWIND

colors: {
  'brand-1': '#352242',
  'brand-2': '#987c88',
  'brand-3': '#c54045',
  'brand-4': '#7caf6d',
  'brand-5': '#d8c6b2',
}

RGB Array

[53, 34, 66], [152, 124, 136], [197, 64, 69], [124, 175, 109], [216, 198, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #352242, #987C88, #C54045, #7CAF6D, #D8C6B2 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: #352242; --color-2: #987c88; --color-3: #c54045; --color-4: #7caf6d; --color-5: #d8c6b2. 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