← Back to Editor

#450B1C · #7D1711 · #B81213 · #CD370E · #C75F1F

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#450B1C

Dark Violet · Maroon · Raspberry

HEX
#450B1C
RGB
rgb(69, 11, 28)
HSL
hsl(342, 72%, 16%)
HSB
hsb(342, 84%, 27%)
CMYK
cmyk(0%, 84%, 59%, 73%)
Oklch
oklch(26.3% 0.087 8.5)

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

#7D1711

Vermilion · Maroon · Wine Red

HEX
#7D1711
RGB
rgb(125, 23, 17)
HSL
hsl(3, 76%, 28%)
HSB
hsb(3, 86%, 49%)
CMYK
cmyk(0%, 82%, 86%, 51%)
Oklch
oklch(38.5% 0.138 28.8)

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

#B81213

Vermilion · FireBrick · Wine Red

HEX
#B81213
RGB
rgb(184, 18, 19)
HSL
hsl(360, 82%, 40%)
HSB
hsb(360, 90%, 72%)
CMYK
cmyk(0%, 90%, 90%, 28%)
Oklch
oklch(49.8% 0.195 28.1)

Traditional「Vermilion」· Paint「Wine Red」· Creative Deep Ember

#CD370E

Vermilion · FireBrick · Passion Red

HEX
#CD370E
RGB
rgb(205, 55, 14)
HSL
hsl(13, 87%, 43%)
HSB
hsb(13, 93%, 80%)
CMYK
cmyk(0%, 73%, 93%, 20%)
Oklch
oklch(56.2% 0.192 34.5)

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

#C75F1F

Tangerine · Chocolate · Amber Brown

HEX
#C75F1F
RGB
rgb(199, 95, 31)
HSL
hsl(23, 73%, 45%)
HSB
hsb(23, 84%, 78%)
CMYK
cmyk(0%, 52%, 84%, 22%)
Oklch
oklch(60.3% 0.151 47.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

450B1C
0B4635

Analogous

460B3A
450B1C
46170B

Triadic

450B1C
1D460B
0B1D46

Split-Comp.

450B1C
0B4617
0B3A46

Tetradic

450B1C
3A460B
0B4635
170B46

Contrast Matrix WCAG 2.1 Contrast

450B1C
7D1711
B81213
CD370E
C75F1F
—
1.5
Fail
2.4
Fail
3.1
AA Large
3.9
AA Large
1.5
Fail
—
1.6
Fail
2.1
Fail
2.5
Fail
2.4
Fail
1.6
Fail
—
1.3
Fail
1.6
Fail
3.1
AA Large
2.1
Fail
1.3
Fail
—
1.2
Fail
3.9
AA Large
2.5
Fail
1.6
Fail
1.2
Fail
—
White BG
15.9AAA
10.5AAA
6.7AA
5.1AA
4.1AA Large
Black BG
1.3Fail
2.0Fail
3.1AA Large
4.1AA Large
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2B18
515012
706F13
8C8B18
9A992E

Deuteranopia

2F3417
575E13
7A8613
95A01A
A0A832

Tritanopia

421514
781414
B01313
C62021
C23B3D

Achromatopsia

1E1E1E
353535
444444
5F5F5F
777777

Shades & Tints Shades & Tints

#450B1C

Dark
Light

#7D1711

Dark
Light

#B81213

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #450b1c;
  --color-2: #7d1711;
  --color-3: #b81213;
  --color-4: #cd370e;
  --color-5: #c75f1f;
}

SCSS

$color-1: #450b1c;
$color-2: #7d1711;
$color-3: #b81213;
$color-4: #cd370e;
$color-5: #c75f1f;

TAILWIND

colors: {
  'brand-1': '#450b1c',
  'brand-2': '#7d1711',
  'brand-3': '#b81213',
  'brand-4': '#cd370e',
  'brand-5': '#c75f1f',
}

RGB Array

[69, 11, 28], [125, 23, 17], [184, 18, 19], [205, 55, 14], [199, 95, 31]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #450B1C, #7D1711, #B81213, #CD370E, #C75F1F is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. 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: #450b1c; --color-2: #7d1711; --color-3: #b81213; --color-4: #cd370e; --color-5: #c75f1f. 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 general-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