← Back to Editor

#393621 · #3F1306 · #930807 · #F74332 · #E1D392

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 AppData Visualization

Color Details Color Details

#393621

Autumn Sage · DarkSlateGray · Amber Gold

HEX
#393621
RGB
rgb(57, 54, 33)
HSL
hsl(52, 27%, 18%)
HSB
hsb(52, 42%, 22%)
CMYK
cmyk(0%, 5%, 42%, 78%)
Oklch
oklch(33.0% 0.034 101.1)

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

#3F1306

Vermilion · Black · Deep Berry

HEX
#3F1306
RGB
rgb(63, 19, 6)
HSL
hsl(14, 83%, 14%)
HSB
hsb(14, 90%, 25%)
CMYK
cmyk(0%, 70%, 90%, 75%)
Oklch
oklch(25.6% 0.073 37.2)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#930807

Vermilion · DarkRed · Wine Red

HEX
#930807
RGB
rgb(147, 8, 7)
HSL
hsl(0, 91%, 30%)
HSB
hsb(0, 95%, 58%)
CMYK
cmyk(0%, 95%, 95%, 42%)
Oklch
oklch(42.0% 0.167 28.8)

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

#F74332

Vermilion · Tomato · Passion Red

HEX
#F74332
RGB
rgb(247, 67, 50)
HSL
hsl(5, 92%, 58%)
HSB
hsb(5, 80%, 97%)
CMYK
cmyk(0%, 73%, 80%, 3%)
Oklch
oklch(64.7% 0.219 29.7)

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

#E1D392

Goose Yellow · Khaki · Sunflower

HEX
#E1D392
RGB
rgb(225, 211, 146)
HSL
hsl(49, 57%, 73%)
HSB
hsb(49, 35%, 88%)
CMYK
cmyk(0%, 6%, 35%, 12%)
Oklch
oklch(86.3% 0.085 97.5)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

393621
22253A

Analogous

3A2B22
393621
313A22

Triadic

393621
223A37
37223A

Split-Comp.

393621
22313A
2B223A

Tetradic

393621
223A2B
22253A
3A2231

Contrast Matrix WCAG 2.1 Contrast

393621
3F1306
930807
F74332
E1D392
—
1.3
Fail
1.3
Fail
3.4
AA Large
8.1
AAA
1.3
Fail
—
1.7
Fail
4.4
AA Large
10.7
AAA
1.3
Fail
1.7
Fail
—
2.5
Fail
6.1
AA
3.4
AA Large
4.4
AA Large
2.5
Fail
—
2.4
Fail
8.1
AAA
10.7
AAA
6.1
AA
2.4
Fail
—
White BG
12.2AAA
16.1AAA
9.2AAA
3.6AA Large
1.5Fail
Black BG
1.7Fail
1.3Fail
2.3Fail
5.8AA
13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

383826
2C2C09
575607
A9A736
DBDBA2

Deuteranopia

383827
2F320A
5F6907
B4C137
DCDDA6

Tritanopia

392A2B
3D0C0C
8C0707
EE393A
E0AEB1

Achromatopsia

353535
1F1F1F
313131
777777
D0D0D0

Shades & Tints Shades & Tints

#393621

Dark
Light

#3F1306

Dark
Light

#930807

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #393621;
  --color-2: #3f1306;
  --color-3: #930807;
  --color-4: #f74332;
  --color-5: #e1d392;
}

SCSS

$color-1: #393621;
$color-2: #3f1306;
$color-3: #930807;
$color-4: #f74332;
$color-5: #e1d392;

TAILWIND

colors: {
  'brand-1': '#393621',
  'brand-2': '#3f1306',
  'brand-3': '#930807',
  'brand-4': '#f74332',
  'brand-5': '#e1d392',
}

RGB Array

[57, 54, 33], [63, 19, 6], [147, 8, 7], [247, 67, 50], [225, 211, 146]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #393621, #3F1306, #930807, #F74332, #E1D392 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #393621; --color-2: #3f1306; --color-3: #930807; --color-4: #f74332; --color-5: #e1d392. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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