← Back to Editor

#1E2B3B · #40454B · #A10700 · #D93B36 · #FAC739

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

#1E2B3B

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#1E2B3B
RGB
rgb(30, 43, 59)
HSL
hsl(213, 33%, 17%)
HSB
hsb(213, 49%, 23%)
CMYK
cmyk(49%, 27%, 0%, 77%)
Oklch
oklch(28.5% 0.035 254.0)

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

#40454B

Indigo · DarkSlateGray · Charcoal

HEX
#40454B
RGB
rgb(64, 69, 75)
HSL
hsl(213, 8%, 27%)
HSB
hsb(213, 15%, 29%)
CMYK
cmyk(15%, 8%, 0%, 71%)
Oklch
oklch(38.8% 0.012 252.9)

Traditional「Indigo」· Paint「Charcoal」· Creative Midnight Shadow

#A10700

Vermilion · DarkRed · Wine Red

HEX
#A10700
RGB
rgb(161, 7, 0)
HSL
hsl(3, 100%, 32%)
HSB
hsb(3, 100%, 63%)
CMYK
cmyk(0%, 96%, 100%, 37%)
Oklch
oklch(44.8% 0.180 29.8)

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

#D93B36

Vermilion · Crimson · Passion Red

HEX
#D93B36
RGB
rgb(217, 59, 54)
HSL
hsl(2, 68%, 53%)
HSB
hsb(2, 75%, 85%)
CMYK
cmyk(0%, 73%, 75%, 15%)
Oklch
oklch(59.0% 0.196 27.0)

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

#FAC739

Ginger · SandyBrown · Sunflower

HEX
#FAC739
RGB
rgb(250, 199, 57)
HSL
hsl(44, 95%, 60%)
HSB
hsb(44, 77%, 98%)
CMYK
cmyk(0%, 20%, 77%, 2%)
Oklch
oklch(85.2% 0.158 87.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1E2B3B
3A2D1D

Analogous

1D383A
1E2B3B
1E1D3A

Triadic

1E2B3B
3A1D2A
2A3A1D

Split-Comp.

1E2B3B
3A1E1D
383A1D

Tetradic

1E2B3B
3A1D38
3A2D1D
1D3A1E

Contrast Matrix WCAG 2.1 Contrast

1E2B3B
40454B
A10700
D93B36
FAC739
—
1.5
Fail
1.7
Fail
3.2
AA Large
9.1
AAA
1.5
Fail
—
1.2
Fail
2.1
Fail
6.1
AA
1.7
Fail
1.2
Fail
—
1.8
Fail
5.2
AA
3.2
AA Large
2.1
Fail
1.8
Fail
—
2.9
Fail
9.1
AAA
6.1
AA
5.2
AA
2.9
Fail
—
White BG
14.3AAA
9.7AAA
8.2AAA
4.5AA
1.6Fail
Black BG
1.5Fail
2.2Fail
2.5Fail
4.6AA
13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

242437
42424A
5E5D02
959337
E4E35B

Deuteranopia

232236
424249
677302
9EAA38
E7EB64

Tritanopia

1F3433
404848
990303
D13838
F7767C

Achromatopsia

292929
444444
343434
6A6A6A
C6C6C6

Shades & Tints Shades & Tints

#1E2B3B

Dark
Light

#40454B

Dark
Light

#A10700

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1e2b3b;
  --color-2: #40454b;
  --color-3: #a10700;
  --color-4: #d93b36;
  --color-5: #fac739;
}

SCSS

$color-1: #1e2b3b;
$color-2: #40454b;
$color-3: #a10700;
$color-4: #d93b36;
$color-5: #fac739;

TAILWIND

colors: {
  'brand-1': '#1e2b3b',
  'brand-2': '#40454b',
  'brand-3': '#a10700',
  'brand-4': '#d93b36',
  'brand-5': '#fac739',
}

RGB Array

[30, 43, 59], [64, 69, 75], [161, 7, 0], [217, 59, 54], [250, 199, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #1E2B3B, #40454B, #A10700, #D93B36, #FAC739 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #1e2b3b; --color-2: #40454b; --color-3: #a10700; --color-4: #d93b36; --color-5: #fac739. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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