← Back to Editor

#FF5D00 · #804546 · #342336 · #120C1F · #1D1C58

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

#FF5D00

Tangerine · OrangeRed · Amber Brown

HEX
#FF5D00
RGB
rgb(255, 93, 0)
HSL
hsl(22, 100%, 50%)
HSB
hsb(22, 100%, 100%)
CMYK
cmyk(0%, 64%, 100%, 0%)
Oklch
oklch(68.5% 0.211 40.9)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#804546

Crimson · Sienna · Wine Red

HEX
#804546
RGB
rgb(128, 69, 70)
HSL
hsl(359, 30%, 39%)
HSB
hsb(359, 46%, 50%)
CMYK
cmyk(0%, 46%, 45%, 50%)
Oklch
oklch(46.3% 0.081 19.6)

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

#342336

Dark Plum · DarkSlateGray · Dark Purple

HEX
#342336
RGB
rgb(52, 35, 54)
HSL
hsl(294, 21%, 17%)
HSB
hsb(294, 35%, 21%)
CMYK
cmyk(4%, 35%, 0%, 79%)
Oklch
oklch(28.5% 0.041 323.0)

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

#120C1F

Deep Indigo · Black · Deep Sea Blue

HEX
#120C1F
RGB
rgb(18, 12, 31)
HSL
hsl(259, 44%, 8%)
HSB
hsb(259, 61%, 12%)
CMYK
cmyk(42%, 61%, 0%, 88%)
Oklch
oklch(17.3% 0.039 296.7)

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

#1D1C58

Deep Indigo · MidnightBlue · Prussian Blue

HEX
#1D1C58
RGB
rgb(29, 28, 88)
HSL
hsl(241, 52%, 23%)
HSB
hsb(241, 68%, 35%)
CMYK
cmyk(67%, 68%, 0%, 65%)
Oklch
oklch(27.1% 0.105 277.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF5D00
00A1FF

Analogous

FF0022
FF5D00
FFDD00

Triadic

FF5D00
00FF5E
5D00FF

Split-Comp.

FF5D00
00FFDD
0022FF

Tetradic

FF5D00
22FF00
00A1FF
DD00FF

Contrast Matrix WCAG 2.1 Contrast

FF5D00
804546
342336
120C1F
1D1C58
—
2.4
Fail
4.7
AA
6.2
AA
5.0
AA
2.4
Fail
—
2.0
Fail
2.6
Fail
2.1
Fail
4.7
AA
2.0
Fail
—
1.3
Fail
1.1
Fail
6.2
AA
2.6
Fail
1.3
Fail
—
1.2
Fail
5.0
AA
2.1
Fail
1.1
Fail
1.2
Fail
—
White BG
3.1AA Large
7.3AAA
14.6AAA
19.1AAA
15.4AAA
Black BG
6.8AA
2.9Fail
1.4Fail
1.1Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B717
666646
2D2C31
0F0F1A
1D1D49

Deuteranopia

C2CE1C
6A6E46
2E2F30
101019
1D1D46

Tritanopia

F7282C
7D4646
332E2D
121716
1D3E3C

Achromatopsia

838383
575757
2A2A2A
101010
232323

Shades & Tints Shades & Tints

#FF5D00

Dark
Light

#804546

Dark
Light

#342336

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff5d00;
  --color-2: #804546;
  --color-3: #342336;
  --color-4: #120c1f;
  --color-5: #1d1c58;
}

SCSS

$color-1: #ff5d00;
$color-2: #804546;
$color-3: #342336;
$color-4: #120c1f;
$color-5: #1d1c58;

TAILWIND

colors: {
  'brand-1': '#ff5d00',
  'brand-2': '#804546',
  'brand-3': '#342336',
  'brand-4': '#120c1f',
  'brand-5': '#1d1c58',
}

RGB Array

[255, 93, 0], [128, 69, 70], [52, 35, 54], [18, 12, 31], [29, 28, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #FF5D00, #804546, #342336, #120C1F, #1D1C58 is ideal for: tech websites, dark mode UIs, game UIs, 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: #ff5d00; --color-2: #804546; --color-3: #342336; --color-4: #120c1f; --color-5: #1d1c58. 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 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