← Back to Editor

#3C0113 · #63101A · #D69434 · #774932 · #28231D

dark

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3C0113

Dark Violet · Black · Raspberry

HEX
#3C0113
RGB
rgb(60, 1, 19)
HSL
hsl(342, 97%, 12%)
HSB
hsb(342, 98%, 24%)
CMYK
cmyk(0%, 98%, 68%, 76%)
Oklch
oklch(22.9% 0.090 9.8)

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

#63101A

Vermilion · Maroon · Wine Red

HEX
#63101A
RGB
rgb(99, 16, 26)
HSL
hsl(353, 72%, 23%)
HSB
hsb(353, 84%, 39%)
CMYK
cmyk(0%, 84%, 74%, 61%)
Oklch
oklch(32.8% 0.115 20.5)

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

#D69434

Ginger · GoldenRod · Warm Sun

HEX
#D69434
RGB
rgb(214, 148, 52)
HSL
hsl(36, 66%, 52%)
HSB
hsb(36, 76%, 84%)
CMYK
cmyk(0%, 31%, 76%, 16%)
Oklch
oklch(71.6% 0.134 72.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#774932

Tangerine · Sienna · Amber Brown

HEX
#774932
RGB
rgb(119, 73, 50)
HSL
hsl(20, 41%, 33%)
HSB
hsb(20, 58%, 47%)
CMYK
cmyk(0%, 39%, 58%, 53%)
Oklch
oklch(45.3% 0.072 46.9)

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

#28231D

Ochre · Black · Cinnamon

HEX
#28231D
RGB
rgb(40, 35, 29)
HSL
hsl(33, 16%, 14%)
HSB
hsb(33, 28%, 16%)
CMYK
cmyk(0%, 13%, 27%, 84%)
Oklch
oklch(26.0% 0.013 72.2)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3C0113
013C2A

Analogous

3C0130
3C0113
3C0D01

Triadic

3C0113
133C01
01133C

Split-Comp.

3C0113
013C0D
01303C

Tetradic

3C0113
303C01
013C2A
0D013C

Contrast Matrix WCAG 2.1 Contrast

3C0113
63101A
D69434
774932
28231D
—
1.3
Fail
6.8
AA
2.3
Fail
1.1
Fail
1.3
Fail
—
5.0
AA
1.7
Fail
1.2
Fail
6.8
AA
5.0
AA
—
2.9
Fail
6.0
AA
2.3
Fail
1.7
Fail
2.9
Fail
—
2.1
Fail
1.1
Fail
1.2
Fail
6.0
AA
2.1
Fail
—
White BG
17.4AAA
13.0AAA
2.6Fail
7.5AAA
15.6AAA
Black BG
1.2Fail
1.6Fail
8.1AAA
2.8Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

22220F
3F3E18
B9B94B
636338
26261E

Deuteranopia

262A0E
444A17
BDC251
666939
26271F

Tritanopia

390B0A
5F1615
D35E62
753C3D
282020

Achromatopsia

151515
2A2A2A
9D9D9D
545454
242424

Shades & Tints Shades & Tints

#3C0113

Dark
Light

#63101A

Dark
Light

#D69434

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3c0113;
  --color-2: #63101a;
  --color-3: #d69434;
  --color-4: #774932;
  --color-5: #28231d;
}

SCSS

$color-1: #3c0113;
$color-2: #63101a;
$color-3: #d69434;
$color-4: #774932;
$color-5: #28231d;

TAILWIND

colors: {
  'brand-1': '#3c0113',
  'brand-2': '#63101a',
  'brand-3': '#d69434',
  'brand-4': '#774932',
  'brand-5': '#28231d',
}

RGB Array

[60, 1, 19], [99, 16, 26], [214, 148, 52], [119, 73, 50], [40, 35, 29]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #3C0113, #63101A, #D69434, #774932, #28231D is ideal for: tech websites, dark mode UIs, game UIs. 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: #3c0113; --color-2: #63101a; --color-3: #d69434; --color-4: #774932; --color-5: #28231d. 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. 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