← Back to Editor

#E37546 · #E8320E · #382E27 · #DBD495 · #F5E28C

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

#E37546

Tangerine · Coral · Warm Sun

HEX
#E37546
RGB
rgb(227, 117, 70)
HSL
hsl(18, 74%, 58%)
HSB
hsb(18, 69%, 89%)
CMYK
cmyk(0%, 48%, 69%, 11%)
Oklch
oklch(68.0% 0.150 42.8)

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

#E8320E

Vermilion · OrangeRed · Passion Red

HEX
#E8320E
RGB
rgb(232, 50, 14)
HSL
hsl(10, 89%, 48%)
HSB
hsb(10, 94%, 91%)
CMYK
cmyk(0%, 78%, 94%, 9%)
Oklch
oklch(60.5% 0.221 32.3)

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

#382E27

Tangerine · DarkSlateGray · Cinnamon

HEX
#382E27
RGB
rgb(56, 46, 39)
HSL
hsl(25, 18%, 19%)
HSB
hsb(25, 30%, 22%)
CMYK
cmyk(0%, 18%, 30%, 78%)
Oklch
oklch(31.0% 0.019 56.9)

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

#DBD495

Fresh Green · Khaki · Sunflower

HEX
#DBD495
RGB
rgb(219, 212, 149)
HSL
hsl(54, 49%, 72%)
HSB
hsb(54, 32%, 86%)
CMYK
cmyk(0%, 3%, 32%, 14%)
Oklch
oklch(86.1% 0.082 102.6)

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

#F5E28C

Goose Yellow · Khaki · Sunflower

HEX
#F5E28C
RGB
rgb(245, 226, 140)
HSL
hsl(49, 84%, 75%)
HSB
hsb(49, 43%, 96%)
CMYK
cmyk(0%, 8%, 43%, 4%)
Oklch
oklch(91.0% 0.108 97.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E37546
45B4E3

Analogous

E34564
E37546
E3C345

Triadic

E37546
45E374
7445E3

Split-Comp.

E37546
45E3C3
4564E3

Tetradic

E37546
64E345
45B4E3
C345E3

Contrast Matrix WCAG 2.1 Contrast

E37546
E8320E
382E27
DBD495
F5E28C
—
1.4
Fail
4.3
AA Large
2.0
Fail
2.3
Fail
1.4
Fail
—
3.1
AA Large
2.8
Fail
3.3
AA Large
4.3
AA Large
3.1
AA Large
—
8.7
AAA
10.2
AAA
2.0
Fail
2.8
Fail
8.7
AAA
—
1.2
Fail
2.3
Fail
3.3
AA Large
10.2
AAA
1.2
Fail
—
White BG
3.0AA Large
4.3AA Large
13.2AAA
1.5Fail
1.3Fail
Black BG
6.9AA
4.9AA
1.6Fail
13.9AAA
16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B3B251
999817
343429
D8D8A4
EDEDA1

Deuteranopia

BAC254
A4B119
343529
D8D9A8
EEEFA6

Tritanopia

DD5A5C
DF1E1F
372A2A
DBB0B3
F4B1B5

Achromatopsia

919191
646464
303030
CFCFCF
DEDEDE

Shades & Tints Shades & Tints

#E37546

Dark
Light

#E8320E

Dark
Light

#382E27

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e37546;
  --color-2: #e8320e;
  --color-3: #382e27;
  --color-4: #dbd495;
  --color-5: #f5e28c;
}

SCSS

$color-1: #e37546;
$color-2: #e8320e;
$color-3: #382e27;
$color-4: #dbd495;
$color-5: #f5e28c;

TAILWIND

colors: {
  'brand-1': '#e37546',
  'brand-2': '#e8320e',
  'brand-3': '#382e27',
  'brand-4': '#dbd495',
  'brand-5': '#f5e28c',
}

RGB Array

[227, 117, 70], [232, 50, 14], [56, 46, 39], [219, 212, 149], [245, 226, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E37546, #E8320E, #382E27, #DBD495, #F5E28C 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: #e37546; --color-2: #e8320e; --color-3: #382e27; --color-4: #dbd495; --color-5: #f5e28c. 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