← Back to Editor

#730217 · #BF0413 · #D98E32 · #8C5E35 · #8C2B07

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

#730217

Vermilion · Maroon · Wine Red

HEX
#730217
RGB
rgb(115, 2, 23)
HSL
hsl(349, 97%, 23%)
HSB
hsb(349, 98%, 45%)
CMYK
cmyk(0%, 98%, 80%, 55%)
Oklch
oklch(35.2% 0.140 21.4)

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

#BF0413

Vermilion · FireBrick · Wine Red

HEX
#BF0413
RGB
rgb(191, 4, 19)
HSL
hsl(355, 96%, 38%)
HSB
hsb(355, 98%, 75%)
CMYK
cmyk(0%, 98%, 90%, 25%)
Oklch
oklch(50.7% 0.205 27.2)

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

#D98E32

Ginger · GoldenRod · Warm Sun

HEX
#D98E32
RGB
rgb(217, 142, 50)
HSL
hsl(33, 69%, 52%)
HSB
hsb(33, 77%, 85%)
CMYK
cmyk(0%, 35%, 77%, 15%)
Oklch
oklch(70.8% 0.137 67.0)

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

#8C5E35

Tangerine · Sienna · Amber Brown

HEX
#8C5E35
RGB
rgb(140, 94, 53)
HSL
hsl(28, 45%, 38%)
HSB
hsb(28, 62%, 55%)
CMYK
cmyk(0%, 33%, 62%, 45%)
Oklch
oklch(52.3% 0.083 61.1)

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

#8C2B07

Tangerine · Brown · Amber Brown

HEX
#8C2B07
RGB
rgb(140, 43, 7)
HSL
hsl(16, 90%, 29%)
HSB
hsb(16, 95%, 55%)
CMYK
cmyk(0%, 69%, 95%, 45%)
Oklch
oklch(43.3% 0.138 37.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

730217
02745F

Analogous

740250
730217
742602

Triadic

730217
177402
021774

Split-Comp.

730217
027426
025074

Tetradic

730217
507402
02745F
260274

Contrast Matrix WCAG 2.1 Contrast

730217
BF0413
D98E32
8C5E35
8C2B07
—
1.9
Fail
4.5
AA Large
2.2
Fail
1.4
Fail
1.9
Fail
—
2.4
Fail
1.2
Fail
1.3
Fail
4.5
AA Large
2.4
Fail
—
2.1
Fail
3.2
AA Large
2.2
Fail
1.2
Fail
2.1
Fail
—
1.5
Fail
1.4
Fail
1.3
Fail
3.2
AA Large
1.5
Fail
—
White BG
12.0AAA
6.5AA
2.7Fail
5.6AA
8.5AAA
Black BG
1.8Fail
3.2AA Large
7.9AAA
3.8AA Large
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

424112
6E6C0F
B9B848
78783F
626110

Deuteranopia

495111
79870E
BDC24E
7B7E41
686F12

Tritanopia

6D0E0D
B60D0C
D55A5E
8A4748
871718

Achromatopsia

262626
3E3E3E
9A9A9A
676767
444444

Shades & Tints Shades & Tints

#730217

Dark
Light

#BF0413

Dark
Light

#D98E32

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #730217;
  --color-2: #bf0413;
  --color-3: #d98e32;
  --color-4: #8c5e35;
  --color-5: #8c2b07;
}

SCSS

$color-1: #730217;
$color-2: #bf0413;
$color-3: #d98e32;
$color-4: #8c5e35;
$color-5: #8c2b07;

TAILWIND

colors: {
  'brand-1': '#730217',
  'brand-2': '#bf0413',
  'brand-3': '#d98e32',
  'brand-4': '#8c5e35',
  'brand-5': '#8c2b07',
}

RGB Array

[115, 2, 23], [191, 4, 19], [217, 142, 50], [140, 94, 53], [140, 43, 7]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #730217, #BF0413, #D98E32, #8C5E35, #8C2B07 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: #730217; --color-2: #bf0413; --color-3: #d98e32; --color-4: #8c5e35; --color-5: #8c2b07. 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