← Back to Editor

#371C07 · #FFC105 · #FF7824 · #F30046 · #E6E0B1

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

#371C07

Tangerine · Black · Cinnamon

HEX
#371C07
RGB
rgb(55, 28, 7)
HSL
hsl(26, 77%, 12%)
HSB
hsb(26, 87%, 22%)
CMYK
cmyk(0%, 49%, 87%, 78%)
Oklch
oklch(25.9% 0.053 55.5)

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

#FFC105

Ginger · Gold · Sunflower

HEX
#FFC105
RGB
rgb(255, 193, 5)
HSL
hsl(45, 100%, 51%)
HSB
hsb(45, 98%, 100%)
CMYK
cmyk(0%, 24%, 98%, 0%)
Oklch
oklch(84.4% 0.172 85.0)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#FF7824

Tangerine · Tomato · Warm Sun

HEX
#FF7824
RGB
rgb(255, 120, 36)
HSL
hsl(23, 100%, 57%)
HSB
hsb(23, 86%, 100%)
CMYK
cmyk(0%, 53%, 86%, 0%)
Oklch
oklch(72.1% 0.186 46.9)

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

#F30046

Dark Violet · Crimson · Camellia

HEX
#F30046
RGB
rgb(243, 0, 70)
HSL
hsl(343, 100%, 48%)
HSB
hsb(343, 100%, 95%)
CMYK
cmyk(0%, 100%, 71%, 5%)
Oklch
oklch(61.1% 0.245 18.4)

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

#E6E0B1

Fresh Green · Wheat · Lemon Cream

HEX
#E6E0B1
RGB
rgb(230, 224, 177)
HSL
hsl(53, 51%, 80%)
HSB
hsb(53, 23%, 90%)
CMYK
cmyk(0%, 3%, 23%, 10%)
Oklch
oklch(90.0% 0.062 101.5)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

371C07
072236

Analogous

36070A
371C07
363307

Triadic

371C07
07361B
1B0736

Split-Comp.

371C07
073633
070A36

Tetradic

371C07
0A3607
072236
330736

Contrast Matrix WCAG 2.1 Contrast

371C07
FFC105
FF7824
F30046
E6E0B1
—
9.7
AAA
6.0
AA
3.7
AA Large
11.8
AAA
9.7
AAA
—
1.6
Fail
2.6
Fail
1.2
Fail
6.0
AA
1.6
Fail
—
1.6
Fail
2.0
Fail
3.7
AA Large
2.6
Fail
1.6
Fail
—
3.2
AA Large
11.8
AAA
1.2
Fail
2.0
Fail
3.2
AA Large
—
White BG
15.8AAA
1.6Fail
2.6Fail
4.3AA Large
1.3Fail
Black BG
1.3Fail
12.9AAA
8.0AAA
4.9AA
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B0C
E4E432
C5C338
8A8835
E3E3BC

Deuteranopia

2D2F0D
E8EC3D
CCD73D
98AA31
E4E4BF

Tritanopia

361011
FC565E
F8484C
E72825
E6C5C7

Achromatopsia

222222
BEBEBE
979797
515151
DCDCDC

Shades & Tints Shades & Tints

#371C07

Dark
Light

#FFC105

Dark
Light

#FF7824

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #371c07;
  --color-2: #ffc105;
  --color-3: #ff7824;
  --color-4: #f30046;
  --color-5: #e6e0b1;
}

SCSS

$color-1: #371c07;
$color-2: #ffc105;
$color-3: #ff7824;
$color-4: #f30046;
$color-5: #e6e0b1;

TAILWIND

colors: {
  'brand-1': '#371c07',
  'brand-2': '#ffc105',
  'brand-3': '#ff7824',
  'brand-4': '#f30046',
  'brand-5': '#e6e0b1',
}

RGB Array

[55, 28, 7], [255, 193, 5], [255, 120, 36], [243, 0, 70], [230, 224, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #371C07, #FFC105, #FF7824, #F30046, #E6E0B1 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #371c07; --color-2: #ffc105; --color-3: #ff7824; --color-4: #f30046; --color-5: #e6e0b1. 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. 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