← Back to Editor

#2E293E · #782051 · #C21663 · #DD6E55 · #F8C744

dark

A 5-color dark palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#2E293E

Deep Indigo · DarkSlateGray · Deep Sea Blue

HEX
#2E293E
RGB
rgb(46, 41, 62)
HSL
hsl(254, 20%, 20%)
HSB
hsb(254, 34%, 24%)
CMYK
cmyk(26%, 34%, 0%, 76%)
Oklch
oklch(29.6% 0.038 294.9)

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

#782051

Rose Purple · Purple · Camellia

HEX
#782051
RGB
rgb(120, 32, 81)
HSL
hsl(327, 58%, 30%)
HSB
hsb(327, 73%, 47%)
CMYK
cmyk(0%, 73%, 33%, 53%)
Oklch
oklch(40.0% 0.132 350.5)

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

#C21663

Dark Violet · MediumVioletRed · Camellia

HEX
#C21663
RGB
rgb(194, 22, 99)
HSL
hsl(333, 80%, 42%)
HSB
hsb(333, 89%, 76%)
CMYK
cmyk(0%, 89%, 49%, 24%)
Oklch
oklch(53.3% 0.205 2.1)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#DD6E55

Vermilion · Coral · Passion Red

HEX
#DD6E55
RGB
rgb(221, 110, 85)
HSL
hsl(11, 67%, 60%)
HSB
hsb(11, 62%, 87%)
CMYK
cmyk(0%, 50%, 62%, 13%)
Oklch
oklch(66.3% 0.144 34.0)

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

#F8C744

Ginger · SandyBrown · Sunflower

HEX
#F8C744
RGB
rgb(248, 199, 68)
HSL
hsl(44, 93%, 62%)
HSB
hsb(44, 73%, 97%)
CMYK
cmyk(0%, 20%, 73%, 3%)
Oklch
oklch(85.1% 0.152 87.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2E293E
383D29

Analogous

292E3D
2E293E
38293D

Triadic

2E293E
3D2E29
293D2E

Split-Comp.

2E293E
3D3829
2E3D29

Tetradic

2E293E
3D292E
383D29
293D38

Contrast Matrix WCAG 2.1 Contrast

2E293E
782051
C21663
DD6E55
F8C744
—
1.4
Fail
2.4
Fail
4.3
AA Large
8.8
AAA
1.4
Fail
—
1.7
Fail
3.0
AA Large
6.2
AA
2.4
Fail
1.7
Fail
—
1.8
Fail
3.7
AA Large
4.3
AA Large
3.0
AA Large
1.8
Fail
—
2.1
Fail
8.8
AAA
6.2
AA
3.7
AA Large
2.1
Fail
—
White BG
14.0AAA
9.9AAA
5.9AA
3.3AA Large
1.6Fail
Black BG
1.5Fail
2.1Fail
3.6AA Large
6.4AA
13.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2C39
525145
787650
ADAC5B
E3E264

Deuteranopia

2C2C38
575E42
828E4C
B3BC5D
E6E96B

Tritanopia

2E3534
743C3A
B9423E
D76061
F67D82

Achromatopsia

2D2D2D
404040
525252
8C8C8C
C7C7C7

Shades & Tints Shades & Tints

#2E293E

Dark
Light

#782051

Dark
Light

#C21663

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2e293e;
  --color-2: #782051;
  --color-3: #c21663;
  --color-4: #dd6e55;
  --color-5: #f8c744;
}

SCSS

$color-1: #2e293e;
$color-2: #782051;
$color-3: #c21663;
$color-4: #dd6e55;
$color-5: #f8c744;

TAILWIND

colors: {
  'brand-1': '#2e293e',
  'brand-2': '#782051',
  'brand-3': '#c21663',
  'brand-4': '#dd6e55',
  'brand-5': '#f8c744',
}

RGB Array

[46, 41, 62], [120, 32, 81], [194, 22, 99], [221, 110, 85], [248, 199, 68]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #2E293E, #782051, #C21663, #DD6E55, #F8C744 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #2e293e; --color-2: #782051; --color-3: #c21663; --color-4: #dd6e55; --color-5: #f8c744. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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