← Back to Editor

#F5EFBD · #F09605 · #FF9822 · #F5CF53 · #F3D675

warm

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

#F5EFBD

Fresh Green · Bisque · Lemon Cream

HEX
#F5EFBD
RGB
rgb(245, 239, 189)
HSL
hsl(54, 74%, 85%)
HSB
hsb(54, 23%, 96%)
CMYK
cmyk(0%, 2%, 23%, 4%)
Oklch
oklch(94.5% 0.065 101.8)

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

#F09605

Ochre · Orange · Amber Brown

HEX
#F09605
RGB
rgb(240, 150, 5)
HSL
hsl(37, 96%, 48%)
HSB
hsb(37, 98%, 94%)
CMYK
cmyk(0%, 37%, 98%, 6%)
Oklch
oklch(74.8% 0.164 67.7)

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

#FF9822

Ginger · Orange · Warm Sun

HEX
#FF9822
RGB
rgb(255, 152, 34)
HSL
hsl(32, 100%, 57%)
HSB
hsb(32, 87%, 100%)
CMYK
cmyk(0%, 40%, 87%, 0%)
Oklch
oklch(77.1% 0.169 62.0)

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

#F5CF53

Ginger · SandyBrown · Sunflower

HEX
#F5CF53
RGB
rgb(245, 207, 83)
HSL
hsl(46, 89%, 64%)
HSB
hsb(46, 66%, 96%)
CMYK
cmyk(0%, 16%, 66%, 4%)
Oklch
oklch(86.5% 0.146 91.9)

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

#F3D675

Goose Yellow · Khaki · Sunflower

HEX
#F3D675
RGB
rgb(243, 214, 117)
HSL
hsl(46, 84%, 71%)
HSB
hsb(46, 52%, 95%)
CMYK
cmyk(0%, 12%, 52%, 5%)
Oklch
oklch(88.1% 0.121 93.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F5EFBD
BCC2F5

Analogous

F5D3BC
F5EFBD
DEF5BC

Triadic

F5EFBD
BCF5EF
EFBCF5

Split-Comp.

F5EFBD
BCDEF5
D3BCF5

Tetradic

F5EFBD
BCF5D3
BCC2F5
F5BCDE

Contrast Matrix WCAG 2.1 Contrast

F5EFBD
F09605
FF9822
F5CF53
F3D675
—
2.0
Fail
1.8
Fail
1.3
Fail
1.2
Fail
2.0
Fail
—
1.1
Fail
1.5
Fail
1.6
Fail
1.8
Fail
1.1
Fail
—
1.4
Fail
1.5
Fail
1.3
Fail
1.5
Fail
1.4
Fail
—
1.1
Fail
1.2
Fail
1.6
Fail
1.5
Fail
1.1
Fail
—
White BG
1.2Fail
2.3Fail
2.2Fail
1.5Fail
1.4Fail
Black BG
18.0AAA
9.1AAA
9.8AAA
13.9AAA
14.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F2F2C9
C9C828
D2D13F
E5E471
E6E68C

Deuteranopia

F3F3CC
CED531
D8E045
E7EA78
E8EA92

Tritanopia

F5D3D5
EC444A
FA555A
F3898E
F29FA3

Achromatopsia

EBEBEB
A0A0A0
A9A9A9
CCCCCC
D4D4D4

Shades & Tints Shades & Tints

#F5EFBD

Dark
Light

#F09605

Dark
Light

#FF9822

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f5efbd;
  --color-2: #f09605;
  --color-3: #ff9822;
  --color-4: #f5cf53;
  --color-5: #f3d675;
}

SCSS

$color-1: #f5efbd;
$color-2: #f09605;
$color-3: #ff9822;
$color-4: #f5cf53;
$color-5: #f3d675;

TAILWIND

colors: {
  'brand-1': '#f5efbd',
  'brand-2': '#f09605',
  'brand-3': '#ff9822',
  'brand-4': '#f5cf53',
  'brand-5': '#f3d675',
}

RGB Array

[245, 239, 189], [240, 150, 5], [255, 152, 34], [245, 207, 83], [243, 214, 117]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #F5EFBD, #F09605, #FF9822, #F5CF53, #F3D675 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: #f5efbd; --color-2: #f09605; --color-3: #ff9822; --color-4: #f5cf53; --color-5: #f3d675. 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 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