← Back to Editor

#FA4137 · #FF9845 · #FFCB52 · #E0C07D · #C0B4A8

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

#FA4137

Vermilion · Tomato · Passion Red

HEX
#FA4137
RGB
rgb(250, 65, 55)
HSL
hsl(3, 95%, 60%)
HSB
hsb(3, 78%, 98%)
CMYK
cmyk(0%, 74%, 78%, 2%)
Oklch
oklch(65.1% 0.222 28.2)

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

#FF9845

Apricot · Coral · Warm Sun

HEX
#FF9845
RGB
rgb(255, 152, 69)
HSL
hsl(27, 100%, 64%)
HSB
hsb(27, 73%, 100%)
CMYK
cmyk(0%, 40%, 73%, 0%)
Oklch
oklch(77.3% 0.156 56.2)

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

#FFCB52

Ginger · SandyBrown · Sunflower

HEX
#FFCB52
RGB
rgb(255, 203, 82)
HSL
hsl(42, 100%, 66%)
HSB
hsb(42, 68%, 100%)
CMYK
cmyk(0%, 20%, 68%, 0%)
Oklch
oklch(86.7% 0.147 85.2)

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

#E0C07D

Ginger · BurlyWood · Sunflower

HEX
#E0C07D
RGB
rgb(224, 192, 125)
HSL
hsl(41, 61%, 68%)
HSB
hsb(41, 44%, 88%)
CMYK
cmyk(0%, 14%, 44%, 12%)
Oklch
oklch(82.0% 0.093 84.9)

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

#C0B4A8

Goose Yellow · DarkGray · Warm Sun

HEX
#C0B4A8
RGB
rgb(192, 180, 168)
HSL
hsl(30, 16%, 71%)
HSB
hsb(30, 13%, 75%)
CMYK
cmyk(0%, 6%, 13%, 25%)
Oklch
oklch(77.7% 0.022 67.5)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FA4137
38F0FA

Analogous

FA388F
FA4137
FAA338

Triadic

FA4137
38FA42
4238FA

Split-Comp.

FA4137
38FAA3
388FFA

Tetradic

FA4137
8FFA38
38F0FA
A338FA

Contrast Matrix WCAG 2.1 Contrast

FA4137
FF9845
FFCB52
E0C07D
C0B4A8
—
1.7
Fail
2.4
Fail
2.0
Fail
1.8
Fail
1.7
Fail
—
1.4
Fail
1.2
Fail
1.1
Fail
2.4
Fail
1.4
Fail
—
1.2
Fail
1.3
Fail
2.0
Fail
1.2
Fail
1.2
Fail
—
1.2
Fail
1.8
Fail
1.1
Fail
1.3
Fail
1.2
Fail
—
White BG
3.6AA Large
2.1Fail
1.5Fail
1.7Fail
2.0Fail
Black BG
5.9AA
9.8AAA
13.9AAA
12.0AAA
10.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAA839
D2D159
E8E86F
D2D28D
BBBBAB

Deuteranopia

B5C33A
D8E05E
ECEF76
D4D691
BCBCAC

Tritanopia

F13B3C
FA696C
FC868B
DE9A9D
BFADAE

Achromatopsia

777777
ADADAD
CDCDCD
C2C2C2
B6B6B6

Shades & Tints Shades & Tints

#FA4137

Dark
Light

#FF9845

Dark
Light

#FFCB52

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fa4137;
  --color-2: #ff9845;
  --color-3: #ffcb52;
  --color-4: #e0c07d;
  --color-5: #c0b4a8;
}

SCSS

$color-1: #fa4137;
$color-2: #ff9845;
$color-3: #ffcb52;
$color-4: #e0c07d;
$color-5: #c0b4a8;

TAILWIND

colors: {
  'brand-1': '#fa4137',
  'brand-2': '#ff9845',
  'brand-3': '#ffcb52',
  'brand-4': '#e0c07d',
  'brand-5': '#c0b4a8',
}

RGB Array

[250, 65, 55], [255, 152, 69], [255, 203, 82], [224, 192, 125], [192, 180, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FA4137, #FF9845, #FFCB52, #E0C07D, #C0B4A8 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. 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: #fa4137; --color-2: #ff9845; --color-3: #ffcb52; --color-4: #e0c07d; --color-5: #c0b4a8. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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