← Back to Editor

#8F2121 · #D60000 · #FFFFFF · #6BBE1D · #0C8834

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 AppData Visualization

Color Details Color Details

#8F2121

Vermilion · Brown · Wine Red

HEX
#8F2121
RGB
rgb(143, 33, 33)
HSL
hsl(0, 63%, 35%)
HSB
hsb(0, 77%, 56%)
CMYK
cmyk(0%, 77%, 77%, 44%)
Oklch
oklch(43.0% 0.146 25.8)

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

#D60000

Vermilion · Red · Passion Red

HEX
#D60000
RGB
rgb(214, 0, 0)
HSL
hsl(0, 100%, 42%)
HSB
hsb(0, 100%, 84%)
CMYK
cmyk(0%, 100%, 100%, 16%)
Oklch
oklch(55.0% 0.226 29.2)

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

#FFFFFF

Moonlight White · White · Cloud White

HEX
#FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
HSB
hsb(0, 0%, 100%)
CMYK
cmyk(0%, 0%, 0%, 0%)
Oklch
oklch(100.0% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

#6BBE1D

Pine Green · LimeGreen · Olive Green

HEX
#6BBE1D
RGB
rgb(107, 190, 29)
HSL
hsl(91, 74%, 43%)
HSB
hsb(91, 85%, 75%)
CMYK
cmyk(44%, 0%, 85%, 25%)
Oklch
oklch(72.1% 0.199 134.4)

Traditional「Pine Green」· Paint「Olive Green」· Creative Blush Sunrise

#0C8834

Pine Green · ForestGreen · Forest Green

HEX
#0C8834
RGB
rgb(12, 136, 52)
HSL
hsl(139, 84%, 29%)
HSB
hsb(139, 91%, 53%)
CMYK
cmyk(91%, 0%, 62%, 47%)
Oklch
oklch(54.8% 0.157 147.4)

Traditional「Pine Green」· Paint「Forest Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F2121
219191

Analogous

912159
8F2121
915921

Triadic

8F2121
219121
212191

Split-Comp.

8F2121
219159
215991

Tetradic

8F2121
599121
219191
592191

Contrast Matrix WCAG 2.1 Contrast

8F2121
D60000
FFFFFF
6BBE1D
0C8834
—
1.6
Fail
8.7
AAA
3.7
AA Large
1.9
Fail
1.6
Fail
—
5.4
AA
2.3
Fail
1.2
Fail
8.7
AAA
5.4
AA
—
2.3
Fail
4.6
AA
3.7
AA Large
2.3
Fail
2.3
Fail
—
2.0
Fail
1.9
Fail
1.2
Fail
4.6
AA
2.0
Fail
—
White BG
8.7AAA
5.4AA
1.0Fail
2.3Fail
4.6AA
Black BG
2.4Fail
3.9AA Large
21.0AAA
9.0AAA
4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5F5E21
797700
FFFFFF
8F9044
424348

Deuteranopia

666E21
869600
FFFFFF
8A844D
3B314D

Tritanopia

8A2121
CB0000
FFFFFF
6F6369
12585C

Achromatopsia

424242
404040
FFFFFF
939393
595959

Shades & Tints Shades & Tints

#8F2121

Dark
Light

#D60000

Dark
Light

#FFFFFF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f2121;
  --color-2: #d60000;
  --color-3: #ffffff;
  --color-4: #6bbe1d;
  --color-5: #0c8834;
}

SCSS

$color-1: #8f2121;
$color-2: #d60000;
$color-3: #ffffff;
$color-4: #6bbe1d;
$color-5: #0c8834;

TAILWIND

colors: {
  'brand-1': '#8f2121',
  'brand-2': '#d60000',
  'brand-3': '#ffffff',
  'brand-4': '#6bbe1d',
  'brand-5': '#0c8834',
}

RGB Array

[143, 33, 33], [214, 0, 0], [255, 255, 255], [107, 190, 29], [12, 136, 52]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F2121, #D60000, #FFFFFF, #6BBE1D, #0C8834 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #8f2121; --color-2: #d60000; --color-3: #ffffff; --color-4: #6bbe1d; --color-5: #0c8834. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 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