← Back to Editor

#630E13 · #C2141E · #E72830 · #EE511E · #F4932C

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

#630E13

Vermilion · Maroon · Wine Red

HEX
#630E13
RGB
rgb(99, 14, 19)
HSL
hsl(356, 75%, 22%)
HSB
hsb(356, 86%, 39%)
CMYK
cmyk(0%, 86%, 81%, 61%)
Oklch
oklch(32.6% 0.117 24.2)

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

#C2141E

Vermilion · FireBrick · Passion Red

HEX
#C2141E
RGB
rgb(194, 20, 30)
HSL
hsl(357, 81%, 42%)
HSB
hsb(357, 90%, 76%)
CMYK
cmyk(0%, 90%, 85%, 24%)
Oklch
oklch(51.9% 0.202 26.4)

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

#E72830

Vermilion · Crimson · Passion Red

HEX
#E72830
RGB
rgb(231, 40, 48)
HSL
hsl(357, 80%, 53%)
HSB
hsb(357, 83%, 91%)
CMYK
cmyk(0%, 83%, 79%, 9%)
Oklch
oklch(59.9% 0.223 25.7)

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

#EE511E

Tangerine · OrangeRed · Warm Sun

HEX
#EE511E
RGB
rgb(238, 81, 30)
HSL
hsl(15, 86%, 53%)
HSB
hsb(15, 87%, 93%)
CMYK
cmyk(0%, 66%, 87%, 7%)
Oklch
oklch(64.5% 0.202 36.8)

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

#F4932C

Ginger · GoldenRod · Warm Sun

HEX
#F4932C
RGB
rgb(244, 147, 44)
HSL
hsl(31, 90%, 56%)
HSB
hsb(31, 82%, 96%)
CMYK
cmyk(0%, 40%, 82%, 4%)
Oklch
oklch(74.9% 0.159 61.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

630E13
0E625D

Analogous

620E3E
630E13
62320E

Triadic

630E13
14620E
0E1462

Split-Comp.

630E13
0E6232
0E3E62

Tetradic

630E13
3E620E
0E625D
320E62

Contrast Matrix WCAG 2.1 Contrast

630E13
C2141E
E72830
EE511E
F4932C
—
2.1
Fail
3.0
Fail
3.6
AA Large
5.7
AA
2.1
Fail
—
1.4
Fail
1.7
Fail
2.7
Fail
3.0
Fail
1.4
Fail
—
1.2
Fail
1.9
Fail
3.6
AA Large
1.7
Fail
1.2
Fail
—
1.6
Fail
5.7
AA
2.7
Fail
1.9
Fail
1.6
Fail
—
White BG
13.1AAA
6.2AA
4.4AA Large
3.6AA Large
2.3Fail
Black BG
1.6Fail
3.4AA Large
4.7AA
5.8AA
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3E3D12
77751C
94932E
AAA92A
CAC945

Deuteranopia

434A12
818E1B
9FAE2E
B3BF2D
D0D74B

Tritanopia

5F1111
B91A19
DD2D2C
E63436
EF595D

Achromatopsia

282828
494949
626262
7A7A7A
A4A4A4

Shades & Tints Shades & Tints

#630E13

Dark
Light

#C2141E

Dark
Light

#E72830

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #630e13;
  --color-2: #c2141e;
  --color-3: #e72830;
  --color-4: #ee511e;
  --color-5: #f4932c;
}

SCSS

$color-1: #630e13;
$color-2: #c2141e;
$color-3: #e72830;
$color-4: #ee511e;
$color-5: #f4932c;

TAILWIND

colors: {
  'brand-1': '#630e13',
  'brand-2': '#c2141e',
  'brand-3': '#e72830',
  'brand-4': '#ee511e',
  'brand-5': '#f4932c',
}

RGB Array

[99, 14, 19], [194, 20, 30], [231, 40, 48], [238, 81, 30], [244, 147, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #630E13, #C2141E, #E72830, #EE511E, #F4932C is ideal for: social media posters, mobile apps, e-commerce promos. 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: #630e13; --color-2: #c2141e; --color-3: #e72830; --color-4: #ee511e; --color-5: #f4932c. 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. 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