← Back to Editor

#F34314 · #CC6A43 · #A10749 · #82053B · #470321

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

#F34314

Vermilion · OrangeRed · Passion Red

HEX
#F34314
RGB
rgb(243, 67, 20)
HSL
hsl(13, 90%, 52%)
HSB
hsb(13, 92%, 95%)
CMYK
cmyk(0%, 72%, 92%, 5%)
Oklch
oklch(63.9% 0.219 34.4)

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

#CC6A43

Tangerine · Chocolate · Warm Sun

HEX
#CC6A43
RGB
rgb(204, 106, 67)
HSL
hsl(17, 57%, 53%)
HSB
hsb(17, 67%, 80%)
CMYK
cmyk(0%, 48%, 67%, 20%)
Oklch
oklch(63.1% 0.135 41.7)

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

#A10749

Dark Violet · Brown · Camellia

HEX
#A10749
RGB
rgb(161, 7, 73)
HSL
hsl(334, 92%, 33%)
HSB
hsb(334, 96%, 63%)
CMYK
cmyk(0%, 96%, 55%, 37%)
Oklch
oklch(45.8% 0.180 5.5)

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

#82053B

Dark Violet · Brown · Camellia

HEX
#82053B
RGB
rgb(130, 5, 59)
HSL
hsl(334, 93%, 26%)
HSB
hsb(334, 96%, 51%)
CMYK
cmyk(0%, 96%, 55%, 49%)
Oklch
oklch(39.3% 0.154 4.7)

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

#470321

Dark Violet · Maroon · Raspberry

HEX
#470321
RGB
rgb(71, 3, 33)
HSL
hsl(334, 92%, 15%)
HSB
hsb(334, 96%, 28%)
CMYK
cmyk(0%, 96%, 54%, 72%)
Oklch
oklch(26.1% 0.100 1.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F34314
16C3F3

Analogous

F31655
F34314
F3B416

Triadic

F34314
16F346
4616F3

Split-Comp.

F34314
16F3B4
1655F3

Tetradic

F34314
55F316
16C3F3
B416F3

Contrast Matrix WCAG 2.1 Contrast

F34314
CC6A43
A10749
82053B
470321
—
1.0
Fail
2.1
Fail
2.8
Fail
4.3
AA Large
1.0
Fail
—
2.2
Fail
2.8
Fail
4.4
AA Large
2.1
Fail
2.2
Fail
—
1.3
Fail
2.0
Fail
2.8
Fail
2.8
Fail
1.3
Fail
—
1.6
Fail
4.3
AA Large
4.4
AA Large
2.0
Fail
1.6
Fail
—
White BG
3.7AA Large
3.7AA Large
7.9AAA
10.3AAA
16.1AAA
Black BG
5.6AA
5.7AA
2.6Fail
2.0Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A51F
A2A14C
5E5D39
4C4B2E
2A291A

Deuteranopia

B1BE22
A7AF4F
677335
535D2B
2E3318

Tritanopia

EA282A
C75456
992C2A
7C2421
441413

Achromatopsia

727272
838383
3D3D3D
313131
1B1B1B

Shades & Tints Shades & Tints

#F34314

Dark
Light

#CC6A43

Dark
Light

#A10749

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f34314;
  --color-2: #cc6a43;
  --color-3: #a10749;
  --color-4: #82053b;
  --color-5: #470321;
}

SCSS

$color-1: #f34314;
$color-2: #cc6a43;
$color-3: #a10749;
$color-4: #82053b;
$color-5: #470321;

TAILWIND

colors: {
  'brand-1': '#f34314',
  'brand-2': '#cc6a43',
  'brand-3': '#a10749',
  'brand-4': '#82053b',
  'brand-5': '#470321',
}

RGB Array

[243, 67, 20], [204, 106, 67], [161, 7, 73], [130, 5, 59], [71, 3, 33]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F34314, #CC6A43, #A10749, #82053B, #470321 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: #f34314; --color-2: #cc6a43; --color-3: #a10749; --color-4: #82053b; --color-5: #470321. 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