← Back to Editor

#383440 · #CC8593 · #FFD9DF · #FFE8EC · #535A66

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

#383440

Deep Indigo · DarkSlateGray · Eggplant

HEX
#383440
RGB
rgb(56, 52, 64)
HSL
hsl(260, 10%, 23%)
HSB
hsb(260, 19%, 25%)
CMYK
cmyk(13%, 19%, 0%, 75%)
Oklch
oklch(33.4% 0.021 300.5)

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

#CC8593

Peach Pink · LightCoral · Coral Red

HEX
#CC8593
RGB
rgb(204, 133, 147)
HSL
hsl(348, 41%, 66%)
HSB
hsb(348, 35%, 80%)
CMYK
cmyk(0%, 35%, 28%, 20%)
Oklch
oklch(69.3% 0.089 6.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#FFD9DF

Peach Pink · Linen · Cherry Blossom

HEX
#FFD9DF
RGB
rgb(255, 217, 223)
HSL
hsl(351, 100%, 93%)
HSB
hsb(351, 15%, 100%)
CMYK
cmyk(0%, 15%, 13%, 0%)
Oklch
oklch(91.9% 0.043 7.2)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#FFE8EC

Peach Pink · Linen · Cherry Blossom

HEX
#FFE8EC
RGB
rgb(255, 232, 236)
HSL
hsl(350, 100%, 95%)
HSB
hsb(350, 9%, 100%)
CMYK
cmyk(0%, 9%, 7%, 0%)
Oklch
oklch(95.1% 0.026 5.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#535A66

Indigo · DimGray · Prussian Blue

HEX
#535A66
RGB
rgb(83, 90, 102)
HSL
hsl(218, 10%, 36%)
HSB
hsb(218, 19%, 40%)
CMYK
cmyk(19%, 12%, 0%, 60%)
Oklch
oklch(46.6% 0.021 261.3)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

383440
3D4135

Analogous

353741
383440
3F3541

Triadic

383440
413935
354139

Split-Comp.

383440
413F35
374135

Tetradic

383440
413537
3D4135
35413F

Contrast Matrix WCAG 2.1 Contrast

383440
CC8593
FFD9DF
FFE8EC
535A66
—
4.2
AA Large
9.4
AAA
10.4
AAA
1.7
Fail
4.2
AA Large
—
2.2
Fail
2.5
Fail
2.4
Fail
9.4
AAA
2.2
Fail
—
1.1
Fail
5.4
AA
10.4
AAA
2.5
Fail
1.1
Fail
—
6.0
AA
1.7
Fail
2.4
Fail
5.4
AA
6.0
AA
—
White BG
12.1AAA
2.9Fail
1.3Fail
1.2Fail
6.9AA
Black BG
1.7Fail
7.3AAA
16.2AAA
18.0AAA
3.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

36363D
ADAD90
EFEEDE
F5F5EB
565663

Deuteranopia

37373C
B1B78F
F1F4DD
F6F8EB
565562

Tritanopia

383B3A
C88D8C
FDDCDC
FEEAEA
536160

Achromatopsia

373737
9C9C9C
E5E5E5
EFEFEF
595959

Shades & Tints Shades & Tints

#383440

Dark
Light

#CC8593

Dark
Light

#FFD9DF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #383440;
  --color-2: #cc8593;
  --color-3: #ffd9df;
  --color-4: #ffe8ec;
  --color-5: #535a66;
}

SCSS

$color-1: #383440;
$color-2: #cc8593;
$color-3: #ffd9df;
$color-4: #ffe8ec;
$color-5: #535a66;

TAILWIND

colors: {
  'brand-1': '#383440',
  'brand-2': '#cc8593',
  'brand-3': '#ffd9df',
  'brand-4': '#ffe8ec',
  'brand-5': '#535a66',
}

RGB Array

[56, 52, 64], [204, 133, 147], [255, 217, 223], [255, 232, 236], [83, 90, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #383440, #CC8593, #FFD9DF, #FFE8EC, #535A66 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: #383440; --color-2: #cc8593; --color-3: #ffd9df; --color-4: #ffe8ec; --color-5: #535a66. 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