← Back to Editor

#F9E9B4 · #54BA92 · #73552F · #DE4100 · #EB9331

warm

A 5-color warm palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#F9E9B4

Goose Yellow · Wheat · Lemon Cream

HEX
#F9E9B4
RGB
rgb(249, 233, 180)
HSL
hsl(46, 85%, 84%)
HSB
hsb(46, 28%, 98%)
CMYK
cmyk(0%, 6%, 28%, 2%)
Oklch
oklch(93.4% 0.070 93.3)

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

#54BA92

Mineral Blue · CadetBlue · Olive Green

HEX
#54BA92
RGB
rgb(84, 186, 146)
HSL
hsl(156, 43%, 53%)
HSB
hsb(156, 55%, 73%)
CMYK
cmyk(55%, 0%, 22%, 27%)
Oklch
oklch(71.7% 0.113 165.0)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#73552F

Ochre · DarkOliveGreen · Amber Brown

HEX
#73552F
RGB
rgb(115, 85, 47)
HSL
hsl(34, 42%, 32%)
HSB
hsb(34, 59%, 45%)
CMYK
cmyk(0%, 26%, 59%, 55%)
Oklch
oklch(47.2% 0.067 71.5)

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

#DE4100

Tangerine · OrangeRed · Amber Brown

HEX
#DE4100
RGB
rgb(222, 65, 0)
HSL
hsl(18, 100%, 44%)
HSB
hsb(18, 100%, 87%)
CMYK
cmyk(0%, 71%, 100%, 13%)
Oklch
oklch(60.0% 0.202 36.8)

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

#EB9331

Ginger · GoldenRod · Warm Sun

HEX
#EB9331
RGB
rgb(235, 147, 49)
HSL
hsl(32, 82%, 56%)
HSB
hsb(32, 79%, 92%)
CMYK
cmyk(0%, 37%, 79%, 8%)
Oklch
oklch(73.9% 0.150 63.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F9E9B4
B4C4F9

Analogous

F9C6B4
F9E9B4
E6F9B4

Triadic

F9E9B4
B4F9E9
E9B4F9

Split-Comp.

F9E9B4
B4E6F9
C6B4F9

Tetradic

F9E9B4
B4F9C6
B4C4F9
F9B4E6

Contrast Matrix WCAG 2.1 Contrast

F9E9B4
54BA92
73552F
DE4100
EB9331
—
2.0
Fail
5.7
AA
3.6
AA Large
2.0
Fail
2.0
Fail
—
2.9
Fail
1.8
Fail
1.0
Fail
5.7
AA
2.9
Fail
—
1.6
Fail
2.9
Fail
3.6
AA Large
1.8
Fail
1.6
Fail
—
1.8
Fail
2.0
Fail
1.0
Fail
2.9
Fail
1.8
Fail
—
White BG
1.2Fail
2.4Fail
6.8AA
4.3AA Large
2.4Fail
Black BG
17.3AAA
8.8AAA
3.1AA Large
4.9AA
8.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F2F2C1
80819C
666638
9A9910
C5C449

Deuteranopia

F3F4C4
7A739E
686A3A
A3AF14
CAD14E

Tritanopia

F8CBCD
59A3A5
723F41
D61C1F
E75B60

Achromatopsia

E8E8E8
979797
5A5A5A
696969
A2A2A2

Shades & Tints Shades & Tints

#F9E9B4

Dark
Light

#54BA92

Dark
Light

#73552F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f9e9b4;
  --color-2: #54ba92;
  --color-3: #73552f;
  --color-4: #de4100;
  --color-5: #eb9331;
}

SCSS

$color-1: #f9e9b4;
$color-2: #54ba92;
$color-3: #73552f;
$color-4: #de4100;
$color-5: #eb9331;

TAILWIND

colors: {
  'brand-1': '#f9e9b4',
  'brand-2': '#54ba92',
  'brand-3': '#73552f',
  'brand-4': '#de4100',
  'brand-5': '#eb9331',
}

RGB Array

[249, 233, 180], [84, 186, 146], [115, 85, 47], [222, 65, 0], [235, 147, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #F9E9B4, #54BA92, #73552F, #DE4100, #EB9331 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: #f9e9b4; --color-2: #54ba92; --color-3: #73552f; --color-4: #de4100; --color-5: #eb9331. 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 warm-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