← Back to Editor

#57051F · #AD0C37 · #FF124D · #E86841 · #CCBA35

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

#57051F

Dark Violet · Maroon · Raspberry

HEX
#57051F
RGB
rgb(87, 5, 31)
HSL
hsl(341, 89%, 18%)
HSB
hsb(341, 94%, 34%)
CMYK
cmyk(0%, 94%, 64%, 66%)
Oklch
oklch(29.6% 0.112 10.6)

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

#AD0C37

Dark Violet · FireBrick · Camellia

HEX
#AD0C37
RGB
rgb(173, 12, 55)
HSL
hsl(344, 87%, 36%)
HSB
hsb(344, 93%, 68%)
CMYK
cmyk(0%, 93%, 68%, 32%)
Oklch
oklch(47.9% 0.186 16.2)

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

#FF124D

Vermilion · Crimson · Passion Red

HEX
#FF124D
RGB
rgb(255, 18, 77)
HSL
hsl(345, 100%, 54%)
HSB
hsb(345, 93%, 100%)
CMYK
cmyk(0%, 93%, 70%, 0%)
Oklch
oklch(63.7% 0.250 18.2)

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

#E86841

Vermilion · Tomato · Passion Red

HEX
#E86841
RGB
rgb(232, 104, 65)
HSL
hsl(14, 78%, 58%)
HSB
hsb(14, 72%, 91%)
CMYK
cmyk(0%, 55%, 72%, 9%)
Oklch
oklch(66.8% 0.168 37.5)

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

#CCBA35

Autumn Sage · GoldenRod · Honey Gold

HEX
#CCBA35
RGB
rgb(204, 186, 53)
HSL
hsl(53, 60%, 50%)
HSB
hsb(53, 74%, 80%)
CMYK
cmyk(0%, 9%, 74%, 20%)
Oklch
oklch(78.1% 0.147 101.3)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

57051F
05573D

Analogous

570548
57051F
571405

Triadic

57051F
1F5705
051F57

Split-Comp.

57051F
055714
054857

Tetradic

57051F
485705
05573D
140557

Contrast Matrix WCAG 2.1 Contrast

57051F
AD0C37
FF124D
E86841
CCBA35
—
2.0
Fail
3.8
AA Large
4.5
AA Large
7.4
AAA
2.0
Fail
—
1.9
Fail
2.2
Fail
3.7
AA Large
3.8
AA Large
1.9
Fail
—
1.2
Fail
2.0
Fail
4.5
AA Large
2.2
Fail
1.2
Fail
—
1.6
Fail
7.4
AAA
3.7
AA Large
2.0
Fail
1.6
Fail
—
White BG
14.5AAA
7.3AAA
3.9AA Large
3.2AA Large
2.0Fail
Black BG
1.4Fail
2.9Fail
5.4AA
6.5AA
10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

333319
67662D
98963F
B1AF4A
C4C455

Deuteranopia

383E17
717D2A
A6B83B
B8C24D
C5C75D

Tritanopia

531413
A52423
F33331
E25254
CB6F74

Achromatopsia

202020
414141
606060
8A8A8A
B0B0B0

Shades & Tints Shades & Tints

#57051F

Dark
Light

#AD0C37

Dark
Light

#FF124D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #57051f;
  --color-2: #ad0c37;
  --color-3: #ff124d;
  --color-4: #e86841;
  --color-5: #ccba35;
}

SCSS

$color-1: #57051f;
$color-2: #ad0c37;
$color-3: #ff124d;
$color-4: #e86841;
$color-5: #ccba35;

TAILWIND

colors: {
  'brand-1': '#57051f',
  'brand-2': '#ad0c37',
  'brand-3': '#ff124d',
  'brand-4': '#e86841',
  'brand-5': '#ccba35',
}

RGB Array

[87, 5, 31], [173, 12, 55], [255, 18, 77], [232, 104, 65], [204, 186, 53]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #57051F, #AD0C37, #FF124D, #E86841, #CCBA35 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: #57051f; --color-2: #ad0c37; --color-3: #ff124d; --color-4: #e86841; --color-5: #ccba35. 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