← Back to Editor

#E4A639 · #F6E7D3 · #9F0A28 · #D23D4F · #89A46F

spring

A 5-color spring 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

#E4A639

Ginger · GoldenRod · Warm Sun

HEX
#E4A639
RGB
rgb(228, 166, 57)
HSL
hsl(38, 76%, 56%)
HSB
hsb(38, 75%, 89%)
CMYK
cmyk(0%, 27%, 75%, 11%)
Oklch
oklch(76.6% 0.140 77.4)

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

#F6E7D3

Goose Yellow · Beige · Peach Orange

HEX
#F6E7D3
RGB
rgb(246, 231, 211)
HSL
hsl(34, 66%, 90%)
HSB
hsb(34, 14%, 96%)
CMYK
cmyk(0%, 6%, 14%, 4%)
Oklch
oklch(93.5% 0.031 75.2)

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

#9F0A28

Vermilion · FireBrick · Wine Red

HEX
#9F0A28
RGB
rgb(159, 10, 40)
HSL
hsl(348, 88%, 33%)
HSB
hsb(348, 94%, 62%)
CMYK
cmyk(0%, 94%, 75%, 38%)
Oklch
oklch(44.8% 0.175 20.3)

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

#D23D4F

Vermilion · Crimson · Passion Red

HEX
#D23D4F
RGB
rgb(210, 61, 79)
HSL
hsl(353, 62%, 53%)
HSB
hsb(353, 71%, 82%)
CMYK
cmyk(0%, 71%, 62%, 18%)
Oklch
oklch(58.3% 0.185 18.4)

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

#89A46F

Celadon · DarkSeaGreen · Olive Green

HEX
#89A46F
RGB
rgb(137, 164, 111)
HSL
hsl(91, 23%, 54%)
HSB
hsb(91, 32%, 64%)
CMYK
cmyk(16%, 0%, 32%, 36%)
Oklch
oklch(68.4% 0.080 130.2)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E4A639
3A78E4

Analogous

E4503A
E4A639
CDE43A

Triadic

E4A639
3AE4A6
A63AE4

Split-Comp.

E4A639
3ACDE4
503AE4

Tetradic

E4A639
3AE450
3A78E4
E43ACD

Contrast Matrix WCAG 2.1 Contrast

E4A639
F6E7D3
9F0A28
D23D4F
89A46F
—
1.8
Fail
3.9
AA Large
2.2
Fail
1.3
Fail
1.8
Fail
—
6.8
AA
3.8
AA Large
2.3
Fail
3.9
AA Large
6.8
AA
—
1.8
Fail
3.0
Fail
2.2
Fail
3.8
AA Large
1.8
Fail
—
1.7
Fail
1.3
Fail
2.3
Fail
3.0
Fail
1.7
Fail
—
White BG
2.1Fail
1.2Fail
8.2AAA
4.6AA
2.8Fail
Black BG
9.8AAA
17.3AAA
2.5Fail
4.5AA
7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C953
F0EFD8
5E5D21
91904B
95957C

Deuteranopia

CDD15A
F0F2D9
67721F
9AA54A
93917F

Tritanopia

E1686D
F5DCDD
981B1A
CB4746
8A8688

Achromatopsia

ACACAC
E9E9E9
3A3A3A
6C6C6C
969696

Shades & Tints Shades & Tints

#E4A639

Dark
Light

#F6E7D3

Dark
Light

#9F0A28

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e4a639;
  --color-2: #f6e7d3;
  --color-3: #9f0a28;
  --color-4: #d23d4f;
  --color-5: #89a46f;
}

SCSS

$color-1: #e4a639;
$color-2: #f6e7d3;
$color-3: #9f0a28;
$color-4: #d23d4f;
$color-5: #89a46f;

TAILWIND

colors: {
  'brand-1': '#e4a639',
  'brand-2': '#f6e7d3',
  'brand-3': '#9f0a28',
  'brand-4': '#d23d4f',
  'brand-5': '#89a46f',
}

RGB Array

[228, 166, 57], [246, 231, 211], [159, 10, 40], [210, 61, 79], [137, 164, 111]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #E4A639, #F6E7D3, #9F0A28, #D23D4F, #89A46F 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: #e4a639; --color-2: #f6e7d3; --color-3: #9f0a28; --color-4: #d23d4f; --color-5: #89a46f. 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 spring-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