← Back to Editor

#210D0B · #833904 · #B1103C · #C7333F · #D37F1C

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

#210D0B

Crimson · Black · Deep Berry

HEX
#210D0B
RGB
rgb(33, 13, 11)
HSL
hsl(5, 50%, 9%)
HSB
hsb(5, 67%, 13%)
CMYK
cmyk(0%, 61%, 67%, 87%)
Oklch
oklch(18.9% 0.035 26.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#833904

Tangerine · Brown · Amber Brown

HEX
#833904
RGB
rgb(131, 57, 4)
HSL
hsl(25, 94%, 26%)
HSB
hsb(25, 97%, 51%)
CMYK
cmyk(0%, 56%, 97%, 49%)
Oklch
oklch(43.7% 0.117 48.0)

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

#B1103C

Dark Violet · FireBrick · Camellia

HEX
#B1103C
RGB
rgb(177, 16, 60)
HSL
hsl(344, 83%, 38%)
HSB
hsb(344, 91%, 69%)
CMYK
cmyk(0%, 91%, 66%, 31%)
Oklch
oklch(48.9% 0.188 15.0)

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

#C7333F

Crimson · Crimson · Passion Red

HEX
#C7333F
RGB
rgb(199, 51, 63)
HSL
hsl(355, 59%, 49%)
HSB
hsb(355, 74%, 78%)
CMYK
cmyk(0%, 74%, 68%, 22%)
Oklch
oklch(55.2% 0.184 21.5)

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

#D37F1C

Ochre · Chocolate · Amber Brown

HEX
#D37F1C
RGB
rgb(211, 127, 28)
HSL
hsl(32, 77%, 47%)
HSB
hsb(32, 87%, 83%)
CMYK
cmyk(0%, 40%, 87%, 17%)
Oklch
oklch(67.2% 0.145 63.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

210D0B
0B2122

Analogous

220B15
210D0B
22190B

Triadic

210D0B
0B220D
0D0B22

Split-Comp.

210D0B
0B2219
0B1522

Tetradic

210D0B
15220B
0B2122
190B22

Contrast Matrix WCAG 2.1 Contrast

210D0B
833904
B1103C
C7333F
D37F1C
—
2.3
Fail
2.7
Fail
3.5
AA Large
6.1
AA
2.3
Fail
—
1.2
Fail
1.6
Fail
2.7
Fail
2.7
Fail
1.2
Fail
—
1.3
Fail
2.3
Fail
3.5
AA Large
1.6
Fail
1.3
Fail
—
1.7
Fail
6.1
AA
2.7
Fail
2.3
Fail
1.7
Fail
—
White BG
18.6AAA
8.2AAA
7.0AA
5.3AA
3.1AA Large
Black BG
1.1Fail
2.6Fail
3.0AA Large
4.0AA Large
6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

18180B
636211
6B6A31
87863C
AFAE34

Deuteranopia

1A1B0C
676D14
75812F
909B3B
B4BA3A

Tritanopia

200C0C
7F1B1D
A92927
C03A39
CF474B

Achromatopsia

131313
494949
454545
616161
8D8D8D

Shades & Tints Shades & Tints

#210D0B

Dark
Light

#833904

Dark
Light

#B1103C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #210d0b;
  --color-2: #833904;
  --color-3: #b1103c;
  --color-4: #c7333f;
  --color-5: #d37f1c;
}

SCSS

$color-1: #210d0b;
$color-2: #833904;
$color-3: #b1103c;
$color-4: #c7333f;
$color-5: #d37f1c;

TAILWIND

colors: {
  'brand-1': '#210d0b',
  'brand-2': '#833904',
  'brand-3': '#b1103c',
  'brand-4': '#c7333f',
  'brand-5': '#d37f1c',
}

RGB Array

[33, 13, 11], [131, 57, 4], [177, 16, 60], [199, 51, 63], [211, 127, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #210D0B, #833904, #B1103C, #C7333F, #D37F1C 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: #210d0b; --color-2: #833904; --color-3: #b1103c; --color-4: #c7333f; --color-5: #d37f1c. 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