← Back to Editor

#FAD476 · #F48744 · #D74C3E · #A1D6C6 · #B7BB62

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#FAD476

Goose Yellow · Khaki · Sunflower

HEX
#FAD476
RGB
rgb(250, 212, 118)
HSL
hsl(43, 93%, 72%)
HSB
hsb(43, 53%, 98%)
CMYK
cmyk(0%, 15%, 53%, 2%)
Oklch
oklch(88.3% 0.121 87.9)

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

#F48744

Apricot · Coral · Warm Sun

HEX
#F48744
RGB
rgb(244, 135, 68)
HSL
hsl(23, 89%, 61%)
HSB
hsb(23, 72%, 96%)
CMYK
cmyk(0%, 45%, 72%, 4%)
Oklch
oklch(73.1% 0.155 49.7)

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

#D74C3E

Vermilion · Chocolate · Passion Red

HEX
#D74C3E
RGB
rgb(215, 76, 62)
HSL
hsl(5, 66%, 54%)
HSB
hsb(5, 71%, 84%)
CMYK
cmyk(0%, 65%, 71%, 16%)
Oklch
oklch(60.5% 0.177 29.0)

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

#A1D6C6

Jade · LightSteelBlue · Lake Green

HEX
#A1D6C6
RGB
rgb(161, 214, 198)
HSL
hsl(162, 39%, 74%)
HSB
hsb(162, 25%, 84%)
CMYK
cmyk(25%, 0%, 7%, 16%)
Oklch
oklch(83.5% 0.059 174.3)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#B7BB62

Autumn Sage · Tan · Sunflower

HEX
#B7BB62
RGB
rgb(183, 187, 98)
HSL
hsl(63, 40%, 56%)
HSB
hsb(63, 48%, 73%)
CMYK
cmyk(2%, 0%, 48%, 27%)
Oklch
oklch(77.0% 0.113 111.1)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAD476
759BFA

Analogous

FA9275
FAD476
DDFA75

Triadic

FAD476
75FAD4
D475FA

Split-Comp.

FAD476
75DDFA
9275FA

Tetradic

FAD476
75FA92
759BFA
FA75DD

Contrast Matrix WCAG 2.1 Contrast

FAD476
F48744
D74C3E
A1D6C6
B7BB62
—
1.8
Fail
3.0
Fail
1.1
Fail
1.4
Fail
1.8
Fail
—
1.7
Fail
1.5
Fail
1.2
Fail
3.0
Fail
1.7
Fail
—
2.6
Fail
2.1
Fail
1.1
Fail
1.5
Fail
2.6
Fail
—
1.3
Fail
1.4
Fail
1.2
Fail
2.1
Fail
1.3
Fail
—
White BG
1.4Fail
2.5Fail
4.2AA Large
1.6Fail
2.0Fail
Black BG
14.7AAA
8.4AAA
5.0AA
12.9AAA
10.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EAE98D
C5C454
9B9A41
B8B8CA
B9B978

Deuteranopia

ECEF92
CBD358
A3AD42
B5B1CB
B9B87D

Tritanopia

F89FA3
EF6164
D04445
A4CDCE
B7898C

Achromatopsia

D5D5D5
A0A0A0
747474
C4C4C4
B0B0B0

Shades & Tints Shades & Tints

#FAD476

Dark
Light

#F48744

Dark
Light

#D74C3E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fad476;
  --color-2: #f48744;
  --color-3: #d74c3e;
  --color-4: #a1d6c6;
  --color-5: #b7bb62;
}

SCSS

$color-1: #fad476;
$color-2: #f48744;
$color-3: #d74c3e;
$color-4: #a1d6c6;
$color-5: #b7bb62;

TAILWIND

colors: {
  'brand-1': '#fad476',
  'brand-2': '#f48744',
  'brand-3': '#d74c3e',
  'brand-4': '#a1d6c6',
  'brand-5': '#b7bb62',
}

RGB Array

[250, 212, 118], [244, 135, 68], [215, 76, 62], [161, 214, 198], [183, 187, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAD476, #F48744, #D74C3E, #A1D6C6, #B7BB62 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: #fad476; --color-2: #f48744; --color-3: #d74c3e; --color-4: #a1d6c6; --color-5: #b7bb62. 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 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