← Back to Editor

#E3D081 · #E8A768 · #EC7E4F · #E23560 · #7C223A

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

#E3D081

Ginger · BurlyWood · Sunflower

HEX
#E3D081
RGB
rgb(227, 208, 129)
HSL
hsl(48, 64%, 70%)
HSB
hsb(48, 43%, 89%)
CMYK
cmyk(0%, 8%, 43%, 11%)
Oklch
oklch(85.6% 0.101 96.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#E8A768

Ginger · SandyBrown · Warm Sun

HEX
#E8A768
RGB
rgb(232, 167, 104)
HSL
hsl(30, 74%, 66%)
HSB
hsb(30, 55%, 91%)
CMYK
cmyk(0%, 28%, 55%, 9%)
Oklch
oklch(77.7% 0.111 64.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#EC7E4F

Apricot · Coral · Warm Sun

HEX
#EC7E4F
RGB
rgb(236, 126, 79)
HSL
hsl(18, 81%, 62%)
HSB
hsb(18, 67%, 93%)
CMYK
cmyk(0%, 47%, 67%, 7%)
Oklch
oklch(70.8% 0.149 43.0)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#E23560

Vermilion · Crimson · Passion Red

HEX
#E23560
RGB
rgb(226, 53, 96)
HSL
hsl(345, 75%, 55%)
HSB
hsb(345, 77%, 89%)
CMYK
cmyk(0%, 77%, 58%, 11%)
Oklch
oklch(60.7% 0.208 12.2)

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

#7C223A

Dark Violet · Brown · Camellia

HEX
#7C223A
RGB
rgb(124, 34, 58)
HSL
hsl(344, 57%, 31%)
HSB
hsb(344, 73%, 49%)
CMYK
cmyk(0%, 73%, 53%, 51%)
Oklch
oklch(40.2% 0.124 8.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3D081
8295E3

Analogous

E39F82
E3D081
C6E382

Triadic

E3D081
82E3D0
D082E3

Split-Comp.

E3D081
82C6E3
9F82E3

Tetradic

E3D081
82E39F
8295E3
E382C6

Contrast Matrix WCAG 2.1 Contrast

E3D081
E8A768
EC7E4F
E23560
7C223A
—
1.3
Fail
1.8
Fail
2.8
Fail
6.3
AA
1.3
Fail
—
1.3
Fail
2.1
Fail
4.7
AA
1.8
Fail
1.3
Fail
—
1.6
Fail
3.6
AA Large
2.8
Fail
2.1
Fail
1.6
Fail
—
2.3
Fail
6.3
AA
4.7
AA
3.6
AA Large
2.3
Fail
—
White BG
1.5Fail
2.1Fail
2.7Fail
4.3AA Large
9.8AAA
Black BG
13.6AAA
10.2AAA
7.7AAA
4.9AA
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDB94
CCCB77
BCBB5A
979656
555434

Deuteranopia

DCDD99
D0D47B
C3CB5D
A1AE53
5A6133

Tritanopia

E2A3A7
E58386
E76365
D94D4C
78302F

Achromatopsia

CDCDCD
B3B3B3
9A9A9A
6E6E6E
404040

Shades & Tints Shades & Tints

#E3D081

Dark
Light

#E8A768

Dark
Light

#EC7E4F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3d081;
  --color-2: #e8a768;
  --color-3: #ec7e4f;
  --color-4: #e23560;
  --color-5: #7c223a;
}

SCSS

$color-1: #e3d081;
$color-2: #e8a768;
$color-3: #ec7e4f;
$color-4: #e23560;
$color-5: #7c223a;

TAILWIND

colors: {
  'brand-1': '#e3d081',
  'brand-2': '#e8a768',
  'brand-3': '#ec7e4f',
  'brand-4': '#e23560',
  'brand-5': '#7c223a',
}

RGB Array

[227, 208, 129], [232, 167, 104], [236, 126, 79], [226, 53, 96], [124, 34, 58]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E3D081, #E8A768, #EC7E4F, #E23560, #7C223A is ideal for: social media posters, mobile apps, e-commerce promos. 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: #e3d081; --color-2: #e8a768; --color-3: #ec7e4f; --color-4: #e23560; --color-5: #7c223a. 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. 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