← Back to Editor

#201A24 · #655069 · #DACFD8 · #F3FEF5 · #CDDFD1

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

#201A24

Dark Plum · Black · Dark Purple

HEX
#201A24
RGB
rgb(32, 26, 36)
HSL
hsl(276, 16%, 12%)
HSB
hsb(276, 28%, 14%)
CMYK
cmyk(11%, 28%, 0%, 86%)
Oklch
oklch(22.9% 0.021 311.7)

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

#655069

Dark Plum · DimGray · Eggplant

HEX
#655069
RGB
rgb(101, 80, 105)
HSL
hsl(290, 14%, 36%)
HSB
hsb(290, 24%, 41%)
CMYK
cmyk(4%, 24%, 0%, 59%)
Oklch
oklch(46.2% 0.048 320.9)

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

#DACFD8

Mauve · LightGray · Lavender

HEX
#DACFD8
RGB
rgb(218, 207, 216)
HSL
hsl(311, 13%, 83%)
HSB
hsb(311, 5%, 85%)
CMYK
cmyk(0%, 5%, 1%, 15%)
Oklch
oklch(86.6% 0.017 331.6)

Traditional「Mauve」· Paint「Lavender」· Creative Rose Petal

#F3FEF5

Emerald · Snow · Mint Green

HEX
#F3FEF5
RGB
rgb(243, 254, 245)
HSL
hsl(131, 85%, 97%)
HSB
hsb(131, 4%, 100%)
CMYK
cmyk(4%, 0%, 4%, 0%)
Oklch
oklch(98.6% 0.017 151.1)

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

#CDDFD1

Celadon · LightGray · Mint Green

HEX
#CDDFD1
RGB
rgb(205, 223, 209)
HSL
hsl(133, 22%, 84%)
HSB
hsb(133, 8%, 87%)
CMYK
cmyk(8%, 0%, 6%, 13%)
Oklch
oklch(88.6% 0.027 152.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

201A24
1E231A

Analogous

1B1A23
201A24
231A23

Triadic

201A24
23201A
1A2320

Split-Comp.

201A24
23231A
1A231B

Tetradic

201A24
231B1A
1E231A
1A2323

Contrast Matrix WCAG 2.1 Contrast

201A24
655069
DACFD8
F3FEF5
CDDFD1
—
2.4
Fail
11.3
AAA
16.4
AAA
12.2
AAA
2.4
Fail
—
4.8
AA
7.0
AA
5.2
AA
11.3
AAA
4.8
AA
—
1.5
Fail
1.1
Fail
16.4
AAA
7.0
AA
1.5
Fail
—
1.3
Fail
12.2
AAA
5.2
AA
1.1
Fail
1.3
Fail
—
White BG
17.0AAA
7.2AAA
1.5Fail
1.0Fail
1.4Fail
Black BG
1.2Fail
2.9Fail
13.9AAA
20.3AAA
15.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1D1D22
5C5C63
D5D5D6
F8F8F7
D5D5D4

Deuteranopia

1E1E21
5D5F62
D6D7D5
F7F6F8
D4D2D5

Tritanopia

20201F
645E5D
D9D4D4
F4F9F9
CED7D8

Achromatopsia

1D1D1D
595959
D3D3D3
FAFAFA
D8D8D8

Shades & Tints Shades & Tints

#201A24

Dark
Light

#655069

Dark
Light

#DACFD8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #201a24;
  --color-2: #655069;
  --color-3: #dacfd8;
  --color-4: #f3fef5;
  --color-5: #cddfd1;
}

SCSS

$color-1: #201a24;
$color-2: #655069;
$color-3: #dacfd8;
$color-4: #f3fef5;
$color-5: #cddfd1;

TAILWIND

colors: {
  'brand-1': '#201a24',
  'brand-2': '#655069',
  'brand-3': '#dacfd8',
  'brand-4': '#f3fef5',
  'brand-5': '#cddfd1',
}

RGB Array

[32, 26, 36], [101, 80, 105], [218, 207, 216], [243, 254, 245], [205, 223, 209]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #201A24, #655069, #DACFD8, #F3FEF5, #CDDFD1 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: #201a24; --color-2: #655069; --color-3: #dacfd8; --color-4: #f3fef5; --color-5: #cddfd1. 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