← Back to Editor

#5E2D5E · #AA312D · #8A710F · #B97309 · #CC3F07

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

#5E2D5E

Rose Purple · DarkSlateBlue · Eggplant

HEX
#5E2D5E
RGB
rgb(94, 45, 94)
HSL
hsl(300, 35%, 27%)
HSB
hsb(300, 52%, 37%)
CMYK
cmyk(0%, 52%, 0%, 63%)
Oklch
oklch(38.2% 0.100 327.3)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#AA312D

Crimson · Brown · Passion Red

HEX
#AA312D
RGB
rgb(170, 49, 45)
HSL
hsl(2, 58%, 42%)
HSB
hsb(2, 74%, 67%)
CMYK
cmyk(0%, 71%, 74%, 33%)
Oklch
oklch(49.7% 0.158 26.6)

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

#8A710F

Ochre · Olive · Honey Gold

HEX
#8A710F
RGB
rgb(138, 113, 15)
HSL
hsl(48, 80%, 30%)
HSB
hsb(48, 89%, 54%)
CMYK
cmyk(0%, 18%, 89%, 46%)
Oklch
oklch(55.7% 0.110 92.7)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#B97309

Ochre · DarkGoldenRod · Amber Brown

HEX
#B97309
RGB
rgb(185, 115, 9)
HSL
hsl(36, 91%, 38%)
HSB
hsb(36, 95%, 73%)
CMYK
cmyk(0%, 38%, 95%, 27%)
Oklch
oklch(61.7% 0.133 67.6)

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

#CC3F07

Tangerine · FireBrick · Amber Brown

HEX
#CC3F07
RGB
rgb(204, 63, 7)
HSL
hsl(17, 93%, 41%)
HSB
hsb(17, 97%, 80%)
CMYK
cmyk(0%, 69%, 97%, 20%)
Oklch
oklch(56.8% 0.186 37.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5E2D5E
2D5D2D

Analogous

452D5D
5E2D5E
5D2D45

Triadic

5E2D5E
5D5D2D
2D5D5D

Split-Comp.

5E2D5E
455D2D
2D5D45

Tetradic

5E2D5E
5D452D
2D5D2D
2D455D

Contrast Matrix WCAG 2.1 Contrast

5E2D5E
AA312D
8A710F
B97309
CC3F07
—
1.6
Fail
2.2
Fail
2.7
Fail
2.1
Fail
1.6
Fail
—
1.4
Fail
1.7
Fail
1.3
Fail
2.2
Fail
1.4
Fail
—
1.2
Fail
1.0
Fail
2.7
Fail
1.7
Fail
1.2
Fail
—
1.3
Fail
2.1
Fail
1.3
Fail
1.0
Fail
1.3
Fail
—
White BG
10.4AAA
6.6AA
4.7AA
3.8AA Large
4.9AA
Black BG
2.0Fail
3.2AA Large
4.4AA Large
5.5AA
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

494852
76752E
7F7F27
9B9A23
8F8E15

Deuteranopia

4C4F4F
7D862E
81832C
9FA429
97A218

Tritanopia

5C4947
A42F2F
89393E
B6373B
C51F22

Achromatopsia

414141
555555
6D6D6D
7C7C7C
636363

Shades & Tints Shades & Tints

#5E2D5E

Dark
Light

#AA312D

Dark
Light

#8A710F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5e2d5e;
  --color-2: #aa312d;
  --color-3: #8a710f;
  --color-4: #b97309;
  --color-5: #cc3f07;
}

SCSS

$color-1: #5e2d5e;
$color-2: #aa312d;
$color-3: #8a710f;
$color-4: #b97309;
$color-5: #cc3f07;

TAILWIND

colors: {
  'brand-1': '#5e2d5e',
  'brand-2': '#aa312d',
  'brand-3': '#8a710f',
  'brand-4': '#b97309',
  'brand-5': '#cc3f07',
}

RGB Array

[94, 45, 94], [170, 49, 45], [138, 113, 15], [185, 115, 9], [204, 63, 7]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5E2D5E, #AA312D, #8A710F, #B97309, #CC3F07 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: #5e2d5e; --color-2: #aa312d; --color-3: #8a710f; --color-4: #b97309; --color-5: #cc3f07. 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