← Back to Editor

#C62E20 · #F76117 · #FA7473 · #E87E97 · #D6829E

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

#C62E20

Vermilion · FireBrick · Passion Red

HEX
#C62E20
RGB
rgb(198, 46, 32)
HSL
hsl(5, 72%, 45%)
HSB
hsb(5, 84%, 78%)
CMYK
cmyk(0%, 77%, 84%, 22%)
Oklch
oklch(54.3% 0.190 29.8)

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

#F76117

Tangerine · OrangeRed · Warm Sun

HEX
#F76117
RGB
rgb(247, 97, 23)
HSL
hsl(20, 93%, 53%)
HSB
hsb(20, 91%, 97%)
CMYK
cmyk(0%, 61%, 91%, 3%)
Oklch
oklch(67.8% 0.198 41.4)

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

#FA7473

Peach Pink · Salmon · Coral Red

HEX
#FA7473
RGB
rgb(250, 116, 115)
HSL
hsl(0, 93%, 72%)
HSB
hsb(0, 54%, 98%)
CMYK
cmyk(0%, 54%, 54%, 2%)
Oklch
oklch(71.8% 0.165 22.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#E87E97

Peach Pink · LightCoral · Coral Red

HEX
#E87E97
RGB
rgb(232, 126, 151)
HSL
hsl(346, 70%, 70%)
HSB
hsb(346, 46%, 91%)
CMYK
cmyk(0%, 46%, 35%, 9%)
Oklch
oklch(71.7% 0.133 5.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#D6829E

Rouge · LightCoral · Rose Pink

HEX
#D6829E
RGB
rgb(214, 130, 158)
HSL
hsl(340, 51%, 67%)
HSB
hsb(340, 39%, 84%)
CMYK
cmyk(0%, 39%, 26%, 16%)
Oklch
oklch(70.3% 0.108 358.8)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C62E20
20B8C5

Analogous

C52065
C62E20
C58120

Triadic

C62E20
20C52E
2E20C5

Split-Comp.

C62E20
20C581
2065C5

Tetradic

C62E20
65C520
20B8C5
8120C5

Contrast Matrix WCAG 2.1 Contrast

C62E20
F76117
FA7473
E87E97
D6829E
—
1.8
Fail
2.0
Fail
2.1
Fail
2.0
Fail
1.8
Fail
—
1.2
Fail
1.2
Fail
1.1
Fail
2.0
Fail
1.2
Fail
—
1.0
Fail
1.0
Fail
2.1
Fail
1.2
Fail
1.0
Fail
—
1.0
Fail
2.0
Fail
1.1
Fail
1.0
Fail
1.0
Fail
—
White BG
5.5AA
3.1AA Large
2.7Fail
2.7Fail
2.8Fail
Black BG
3.8AA Large
6.7AA
7.8AAA
7.9AAA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

848323
B6B529
C0BF73
BAB991
B2B197

Deuteranopia

8D9824
BFCA2D
C8D273
C0C890
B7BD96

Tritanopia

BE2627
EF373A
F37373
E38C8B
D29291

Achromatopsia

5A5A5A
858585
9C9C9C
A1A1A1
9E9E9E

Shades & Tints Shades & Tints

#C62E20

Dark
Light

#F76117

Dark
Light

#FA7473

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c62e20;
  --color-2: #f76117;
  --color-3: #fa7473;
  --color-4: #e87e97;
  --color-5: #d6829e;
}

SCSS

$color-1: #c62e20;
$color-2: #f76117;
$color-3: #fa7473;
$color-4: #e87e97;
$color-5: #d6829e;

TAILWIND

colors: {
  'brand-1': '#c62e20',
  'brand-2': '#f76117',
  'brand-3': '#fa7473',
  'brand-4': '#e87e97',
  'brand-5': '#d6829e',
}

RGB Array

[198, 46, 32], [247, 97, 23], [250, 116, 115], [232, 126, 151], [214, 130, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C62E20, #F76117, #FA7473, #E87E97, #D6829E 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: #c62e20; --color-2: #f76117; --color-3: #fa7473; --color-4: #e87e97; --color-5: #d6829e. 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