← Back to Editor

#2A2720 · #53422E · #701E06 · #B32904 · #F3971A

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

#2A2720

Ochre · DarkSlateGray · Amber Gold

HEX
#2A2720
RGB
rgb(42, 39, 32)
HSL
hsl(42, 14%, 15%)
HSB
hsb(42, 24%, 16%)
CMYK
cmyk(0%, 7%, 24%, 84%)
Oklch
oklch(27.4% 0.013 87.6)

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

#53422E

Ochre · DarkOliveGreen · Cinnamon

HEX
#53422E
RGB
rgb(83, 66, 46)
HSL
hsl(32, 29%, 25%)
HSB
hsb(32, 45%, 33%)
CMYK
cmyk(0%, 20%, 45%, 67%)
Oklch
oklch(39.2% 0.039 70.8)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

#701E06

Vermilion · Maroon · Wine Red

HEX
#701E06
RGB
rgb(112, 30, 6)
HSL
hsl(14, 90%, 23%)
HSB
hsb(14, 95%, 44%)
CMYK
cmyk(0%, 73%, 95%, 56%)
Oklch
oklch(36.6% 0.119 35.7)

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

#B32904

Vermilion · FireBrick · Wine Red

HEX
#B32904
RGB
rgb(179, 41, 4)
HSL
hsl(13, 96%, 36%)
HSB
hsb(13, 98%, 70%)
CMYK
cmyk(0%, 77%, 98%, 30%)
Oklch
oklch(50.2% 0.179 33.8)

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

#F3971A

Ginger · GoldenRod · Warm Sun

HEX
#F3971A
RGB
rgb(243, 151, 26)
HSL
hsl(35, 90%, 53%)
HSB
hsb(35, 89%, 95%)
CMYK
cmyk(0%, 38%, 89%, 5%)
Oklch
oklch(75.4% 0.162 66.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A2720
21242C

Analogous

2C2321
2A2720
292C21

Triadic

2A2720
212C28
28212C

Split-Comp.

2A2720
21292C
23212C

Tetradic

2A2720
212C23
21242C
2C2129

Contrast Matrix WCAG 2.1 Contrast

2A2720
53422E
701E06
B32904
F3971A
—
1.6
Fail
1.3
Fail
2.3
Fail
6.6
AA
1.6
Fail
—
1.2
Fail
1.5
Fail
4.2
AA Large
1.3
Fail
1.2
Fail
—
1.7
Fail
4.9
AA
2.3
Fail
1.5
Fail
1.7
Fail
—
2.9
Fail
6.6
AA
4.2
AA Large
4.9
AA
2.9
Fail
—
White BG
14.9AAA
9.6AAA
11.2AAA
6.5AA
2.3Fail
Black BG
1.4Fail
2.2Fail
1.9Fail
3.2AA Large
9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

292922
4C4B33
4C4C0C
77760D
CBCA38

Deuteranopia

292922
4D4E34
51570D
7F8A0F
D1D740

Tritanopia

2A2323
523738
6C1011
AC1416
EE5055

Achromatopsia

272727
454545
343434
4E4E4E
A4A4A4

Shades & Tints Shades & Tints

#2A2720

Dark
Light

#53422E

Dark
Light

#701E06

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a2720;
  --color-2: #53422e;
  --color-3: #701e06;
  --color-4: #b32904;
  --color-5: #f3971a;
}

SCSS

$color-1: #2a2720;
$color-2: #53422e;
$color-3: #701e06;
$color-4: #b32904;
$color-5: #f3971a;

TAILWIND

colors: {
  'brand-1': '#2a2720',
  'brand-2': '#53422e',
  'brand-3': '#701e06',
  'brand-4': '#b32904',
  'brand-5': '#f3971a',
}

RGB Array

[42, 39, 32], [83, 66, 46], [112, 30, 6], [179, 41, 4], [243, 151, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2A2720, #53422E, #701E06, #B32904, #F3971A 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: #2a2720; --color-2: #53422e; --color-3: #701e06; --color-4: #b32904; --color-5: #f3971a. 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