← Back to Editor

#E3521D · #9A413D · #EC7C3A · #F0CB7A · #FBDFAD

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

#E3521D

Tangerine · Chocolate · Amber Brown

HEX
#E3521D
RGB
rgb(227, 82, 29)
HSL
hsl(16, 78%, 50%)
HSB
hsb(16, 87%, 89%)
CMYK
cmyk(0%, 64%, 87%, 11%)
Oklch
oklch(62.8% 0.190 38.2)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#9A413D

Crimson · Sienna · Passion Red

HEX
#9A413D
RGB
rgb(154, 65, 61)
HSL
hsl(3, 43%, 42%)
HSB
hsb(3, 60%, 60%)
CMYK
cmyk(0%, 58%, 60%, 40%)
Oklch
oklch(49.3% 0.120 25.0)

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

#EC7C3A

Tangerine · Coral · Warm Sun

HEX
#EC7C3A
RGB
rgb(236, 124, 58)
HSL
hsl(22, 82%, 58%)
HSB
hsb(22, 75%, 93%)
CMYK
cmyk(0%, 47%, 75%, 7%)
Oklch
oklch(70.2% 0.159 48.3)

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

#F0CB7A

Goose Yellow · BurlyWood · Sunflower

HEX
#F0CB7A
RGB
rgb(240, 203, 122)
HSL
hsl(41, 80%, 71%)
HSB
hsb(41, 49%, 94%)
CMYK
cmyk(0%, 15%, 49%, 6%)
Oklch
oklch(85.7% 0.108 85.6)

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

#FBDFAD

Goose Yellow · Wheat · Peach Orange

HEX
#FBDFAD
RGB
rgb(251, 223, 173)
HSL
hsl(38, 91%, 83%)
HSB
hsb(38, 31%, 98%)
CMYK
cmyk(0%, 11%, 31%, 2%)
Oklch
oklch(91.5% 0.072 81.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3521D
1CAEE3

Analogous

E31C4A
E3521D
E3B51C

Triadic

E3521D
1CE351
511CE3

Split-Comp.

E3521D
1CE3B5
1C4AE3

Tetradic

E3521D
4AE31C
1CAEE3
B51CE3

Contrast Matrix WCAG 2.1 Contrast

E3521D
9A413D
EC7C3A
F0CB7A
FBDFAD
—
1.7
Fail
1.4
Fail
2.5
Fail
3.0
Fail
1.7
Fail
—
2.3
Fail
4.2
AA Large
5.1
AA
1.4
Fail
2.3
Fail
—
1.8
Fail
2.2
Fail
2.5
Fail
4.2
AA Large
1.8
Fail
—
1.2
Fail
3.0
Fail
5.1
AA
2.2
Fail
1.2
Fail
—
White BG
3.8AA Large
6.6AA
2.8Fail
1.6Fail
1.3Fail
Black BG
5.5AA
3.2AA Large
7.5AAA
13.5AAA
16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A32A
73733E
BCBA4A
E0E08E
EFEFB9

Deuteranopia

ADB72D
797F3E
C2CA4E
E2E592
F1F3BC

Tritanopia

DC3436
963F3F
E65759
EE9DA0
FAC3C5

Achromatopsia

777777
5B5B5B
969696
CDCDCD
E2E2E2

Shades & Tints Shades & Tints

#E3521D

Dark
Light

#9A413D

Dark
Light

#EC7C3A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3521d;
  --color-2: #9a413d;
  --color-3: #ec7c3a;
  --color-4: #f0cb7a;
  --color-5: #fbdfad;
}

SCSS

$color-1: #e3521d;
$color-2: #9a413d;
$color-3: #ec7c3a;
$color-4: #f0cb7a;
$color-5: #fbdfad;

TAILWIND

colors: {
  'brand-1': '#e3521d',
  'brand-2': '#9a413d',
  'brand-3': '#ec7c3a',
  'brand-4': '#f0cb7a',
  'brand-5': '#fbdfad',
}

RGB Array

[227, 82, 29], [154, 65, 61], [236, 124, 58], [240, 203, 122], [251, 223, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E3521D, #9A413D, #EC7C3A, #F0CB7A, #FBDFAD 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: #e3521d; --color-2: #9a413d; --color-3: #ec7c3a; --color-4: #f0cb7a; --color-5: #fbdfad. 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