← Back to Editor

#FF7121 · #F1C555 · #1D1603 · #F7F0DE · #9CCE52

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 AppData Visualization

Color Details Color Details

#FF7121

Tangerine · Tomato · Warm Sun

HEX
#FF7121
RGB
rgb(255, 113, 33)
HSL
hsl(22, 100%, 56%)
HSB
hsb(22, 87%, 100%)
CMYK
cmyk(0%, 56%, 87%, 0%)
Oklch
oklch(71.1% 0.192 44.7)

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

#F1C555

Ginger · SandyBrown · Sunflower

HEX
#F1C555
RGB
rgb(241, 197, 85)
HSL
hsl(43, 85%, 64%)
HSB
hsb(43, 65%, 95%)
CMYK
cmyk(0%, 18%, 65%, 5%)
Oklch
oklch(84.2% 0.138 87.5)

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

#1D1603

Ochre · Black · Amber Gold

HEX
#1D1603
RGB
rgb(29, 22, 3)
HSL
hsl(44, 81%, 6%)
HSB
hsb(44, 90%, 11%)
CMYK
cmyk(0%, 24%, 90%, 89%)
Oklch
oklch(20.4% 0.036 90.5)

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

#F7F0DE

Goose Yellow · Beige · Lemon Cream

HEX
#F7F0DE
RGB
rgb(247, 240, 222)
HSL
hsl(43, 61%, 92%)
HSB
hsb(43, 10%, 97%)
CMYK
cmyk(0%, 3%, 10%, 3%)
Oklch
oklch(95.6% 0.025 89.2)

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

#9CCE52

Grass Green · GreenYellow · Olive Green

HEX
#9CCE52
RGB
rgb(156, 206, 82)
HSL
hsl(84, 56%, 56%)
HSB
hsb(84, 60%, 81%)
CMYK
cmyk(24%, 0%, 60%, 19%)
Oklch
oklch(79.1% 0.162 128.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF7121
1FADFF

Analogous

FF1F3D
FF7121
FFE11F

Triadic

FF7121
1FFF71
711FFF

Split-Comp.

FF7121
1FFFE1
1F3DFF

Tetradic

FF7121
3DFF1F
1FADFF
E11FFF

Contrast Matrix WCAG 2.1 Contrast

FF7121
F1C555
1D1603
F7F0DE
9CCE52
—
1.7
Fail
6.5
AA
2.4
Fail
1.5
Fail
1.7
Fail
—
11.0
AAA
1.4
Fail
1.1
Fail
6.5
AA
11.0
AAA
—
15.8
AAA
9.7
AAA
2.4
Fail
1.4
Fail
15.8
AAA
—
1.6
Fail
1.5
Fail
1.1
Fail
9.7
AAA
1.6
Fail
—
White BG
2.8Fail
1.6Fail
18.0AAA
1.1Fail
1.8Fail
Black BG
7.6AAA
12.9AAA
1.2Fail
18.5AAA
11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C034
DEDE70
1A1A08
F4F4E2
B2B270

Deuteranopia

CAD439
E1E477
1A1B09
F4F5E3
AFAB77

Tritanopia

F84447
EF858A
1D0B0C
F7E6E7
9F888D

Achromatopsia

929292
C5C5C5
161616
F0F0F0
B1B1B1

Shades & Tints Shades & Tints

#FF7121

Dark
Light

#F1C555

Dark
Light

#1D1603

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff7121;
  --color-2: #f1c555;
  --color-3: #1d1603;
  --color-4: #f7f0de;
  --color-5: #9cce52;
}

SCSS

$color-1: #ff7121;
$color-2: #f1c555;
$color-3: #1d1603;
$color-4: #f7f0de;
$color-5: #9cce52;

TAILWIND

colors: {
  'brand-1': '#ff7121',
  'brand-2': '#f1c555',
  'brand-3': '#1d1603',
  'brand-4': '#f7f0de',
  'brand-5': '#9cce52',
}

RGB Array

[255, 113, 33], [241, 197, 85], [29, 22, 3], [247, 240, 222], [156, 206, 82]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #FF7121, #F1C555, #1D1603, #F7F0DE, #9CCE52 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: #ff7121; --color-2: #f1c555; --color-3: #1d1603; --color-4: #f7f0de; --color-5: #9cce52. 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