← Back to Editor

#B80639 · #CD3F3B · #CA944A · #ECD36E · #745680

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

#B80639

Dark Violet · FireBrick · Camellia

HEX
#B80639
RGB
rgb(184, 6, 57)
HSL
hsl(343, 94%, 37%)
HSB
hsb(343, 97%, 72%)
CMYK
cmyk(0%, 97%, 69%, 28%)
Oklch
oklch(49.9% 0.197 16.5)

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

#CD3F3B

Crimson · Crimson · Passion Red

HEX
#CD3F3B
RGB
rgb(205, 63, 59)
HSL
hsl(2, 59%, 52%)
HSB
hsb(2, 71%, 80%)
CMYK
cmyk(0%, 69%, 71%, 20%)
Oklch
oklch(57.4% 0.179 26.2)

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

#CA944A

Ginger · GoldenRod · Warm Sun

HEX
#CA944A
RGB
rgb(202, 148, 74)
HSL
hsl(35, 55%, 54%)
HSB
hsb(35, 63%, 79%)
CMYK
cmyk(0%, 27%, 63%, 21%)
Oklch
oklch(70.4% 0.112 72.8)

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

#ECD36E

Ginger · Khaki · Sunflower

HEX
#ECD36E
RGB
rgb(236, 211, 110)
HSL
hsl(48, 77%, 68%)
HSB
hsb(48, 53%, 93%)
CMYK
cmyk(0%, 11%, 53%, 7%)
Oklch
oklch(86.7% 0.124 95.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#745680

Dark Plum · DimGray · Violet

HEX
#745680
RGB
rgb(116, 86, 128)
HSL
hsl(283, 20%, 42%)
HSB
hsb(283, 33%, 50%)
CMYK
cmyk(9%, 33%, 0%, 50%)
Oklch
oklch(50.0% 0.074 316.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B80639
06B785

Analogous

B70691
B80639
B72C06

Triadic

B80639
38B706
0638B7

Split-Comp.

B80639
06B72C
0691B7

Tetradic

B80639
91B706
06B785
2C06B7

Contrast Matrix WCAG 2.1 Contrast

B80639
CD3F3B
CA944A
ECD36E
745680
—
1.4
Fail
2.5
Fail
4.5
AA
1.1
Fail
1.4
Fail
—
1.8
Fail
3.2
AA Large
1.3
Fail
2.5
Fail
1.8
Fail
—
1.8
Fail
2.3
Fail
4.5
AA
3.2
AA Large
1.8
Fail
—
4.2
AA Large
1.1
Fail
1.3
Fail
2.3
Fail
4.2
AA Large
—
White BG
6.7AA
4.8AA
2.7Fail
1.5Fail
6.2AA
Black BG
3.1AA Large
4.4AA Large
7.8AAA
14.1AAA
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

6B692D
908E3C
B3B25C
E1E186
676776

Deuteranopia

75832A
98A23C
B6BA60
E3E58C
696B73

Tritanopia

AF2321
C63D3D
C76A6D
EB9A9E
726E6C

Achromatopsia

414141
696969
9C9C9C
CFCFCF
646464

Shades & Tints Shades & Tints

#B80639

Dark
Light

#CD3F3B

Dark
Light

#CA944A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b80639;
  --color-2: #cd3f3b;
  --color-3: #ca944a;
  --color-4: #ecd36e;
  --color-5: #745680;
}

SCSS

$color-1: #b80639;
$color-2: #cd3f3b;
$color-3: #ca944a;
$color-4: #ecd36e;
$color-5: #745680;

TAILWIND

colors: {
  'brand-1': '#b80639',
  'brand-2': '#cd3f3b',
  'brand-3': '#ca944a',
  'brand-4': '#ecd36e',
  'brand-5': '#745680',
}

RGB Array

[184, 6, 57], [205, 63, 59], [202, 148, 74], [236, 211, 110], [116, 86, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B80639, #CD3F3B, #CA944A, #ECD36E, #745680 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: #b80639; --color-2: #cd3f3b; --color-3: #ca944a; --color-4: #ecd36e; --color-5: #745680. 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