← Back to Editor

#3E3A66 · #624478 · #7A4576 · #FA8989 · #FCBB79

dark

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

#3E3A66

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#3E3A66
RGB
rgb(62, 58, 102)
HSL
hsl(245, 28%, 31%)
HSB
hsb(245, 43%, 40%)
CMYK
cmyk(39%, 43%, 0%, 60%)
Oklch
oklch(37.4% 0.074 286.4)

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

#624478

Dark Plum · DarkSlateBlue · Eggplant

HEX
#624478
RGB
rgb(98, 68, 120)
HSL
hsl(275, 28%, 37%)
HSB
hsb(275, 43%, 47%)
CMYK
cmyk(18%, 43%, 0%, 53%)
Oklch
oklch(44.2% 0.090 309.7)

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

#7A4576

Rose Purple · DimGray · Eggplant

HEX
#7A4576
RGB
rgb(122, 69, 118)
HSL
hsl(305, 28%, 37%)
HSB
hsb(305, 43%, 48%)
CMYK
cmyk(0%, 43%, 3%, 52%)
Oklch
oklch(47.2% 0.100 329.8)

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

#FA8989

Peach Pink · LightCoral · Coral Red

HEX
#FA8989
RGB
rgb(250, 137, 137)
HSL
hsl(0, 92%, 76%)
HSB
hsb(0, 45%, 98%)
CMYK
cmyk(0%, 45%, 45%, 2%)
Oklch
oklch(75.3% 0.138 20.8)

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

#FCBB79

Goose Yellow · LightSalmon · Warm Sun

HEX
#FCBB79
RGB
rgb(252, 187, 121)
HSL
hsl(30, 96%, 73%)
HSB
hsb(30, 52%, 99%)
CMYK
cmyk(0%, 26%, 52%, 1%)
Oklch
oklch(83.8% 0.112 65.7)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3E3A66
616539

Analogous

394B65
3E3A66
533965

Triadic

3E3A66
653D39
39653D

Split-Comp.

3E3A66
655339
4B6539

Tetradic

3E3A66
65394B
616539
396553

Contrast Matrix WCAG 2.1 Contrast

3E3A66
624478
7A4576
FA8989
FCBB79
—
1.3
Fail
1.5
Fail
4.5
AA Large
6.3
AA
1.3
Fail
—
1.1
Fail
3.4
AA Large
4.8
AA
1.5
Fail
1.1
Fail
—
3.1
AA Large
4.3
AA Large
4.5
AA Large
3.4
AA Large
3.1
AA Large
—
1.4
Fail
6.3
AA
4.8
AA
4.3
AA Large
1.4
Fail
—
White BG
10.5AAA
8.0AAA
7.1AAA
2.3Fail
1.7Fail
Black BG
2.0Fail
2.6Fail
2.9Fail
9.0AAA
12.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3C3C5B
55556B
63636A
C9C889
E0DF89

Deuteranopia

3D3D59
575968
666A67
D0D889
E4E88D

Tritanopia

3E5351
61615F
77615F
F48989
F99698

Achromatopsia

404040
535353
5A5A5A
ABABAB
C7C7C7

Shades & Tints Shades & Tints

#3E3A66

Dark
Light

#624478

Dark
Light

#7A4576

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3e3a66;
  --color-2: #624478;
  --color-3: #7a4576;
  --color-4: #fa8989;
  --color-5: #fcbb79;
}

SCSS

$color-1: #3e3a66;
$color-2: #624478;
$color-3: #7a4576;
$color-4: #fa8989;
$color-5: #fcbb79;

TAILWIND

colors: {
  'brand-1': '#3e3a66',
  'brand-2': '#624478',
  'brand-3': '#7a4576',
  'brand-4': '#fa8989',
  'brand-5': '#fcbb79',
}

RGB Array

[62, 58, 102], [98, 68, 120], [122, 69, 118], [250, 137, 137], [252, 187, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #3E3A66, #624478, #7A4576, #FA8989, #FCBB79 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: #3e3a66; --color-2: #624478; --color-3: #7a4576; --color-4: #fa8989; --color-5: #fcbb79. 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 dark-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