← Back to Editor

#FFDF76 · #F27F40 · #5E5248 · #42AC83 · #A6E27D

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

#FFDF76

Goose Yellow · Khaki · Sunflower

HEX
#FFDF76
RGB
rgb(255, 223, 118)
HSL
hsl(46, 100%, 73%)
HSB
hsb(46, 54%, 100%)
CMYK
cmyk(0%, 13%, 54%, 0%)
Oklch
oklch(91.0% 0.129 92.7)

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

#F27F40

Tangerine · Coral · Warm Sun

HEX
#F27F40
RGB
rgb(242, 127, 64)
HSL
hsl(21, 87%, 60%)
HSB
hsb(21, 74%, 95%)
CMYK
cmyk(0%, 48%, 74%, 5%)
Oklch
oklch(71.6% 0.160 47.0)

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

#5E5248

Tangerine · DarkOliveGreen · Amber Brown

HEX
#5E5248
RGB
rgb(94, 82, 72)
HSL
hsl(27, 13%, 33%)
HSB
hsb(27, 23%, 37%)
CMYK
cmyk(0%, 13%, 23%, 63%)
Oklch
oklch(44.7% 0.023 62.0)

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

#42AC83

Mineral Blue · MediumSeaGreen · Olive Green

HEX
#42AC83
RGB
rgb(66, 172, 131)
HSL
hsl(157, 45%, 47%)
HSB
hsb(157, 62%, 67%)
CMYK
cmyk(62%, 0%, 24%, 33%)
Oklch
oklch(67.2% 0.116 164.3)

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

#A6E27D

Emerald · LightGreen · Apple Green

HEX
#A6E27D
RGB
rgb(166, 226, 125)
HSL
hsl(96, 64%, 69%)
HSB
hsb(96, 45%, 89%)
CMYK
cmyk(27%, 0%, 45%, 11%)
Oklch
oklch(84.9% 0.145 133.8)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFDF76
7595FF

Analogous

FF9A75
FFDF76
DAFF75

Triadic

FFDF76
75FFDF
DF75FF

Split-Comp.

FFDF76
75DAFF
9A75FF

Tetradic

FFDF76
75FF9A
7595FF
FF75DA

Contrast Matrix WCAG 2.1 Contrast

FFDF76
F27F40
5E5248
42AC83
A6E27D
—
2.0
Fail
5.8
AA
2.2
Fail
1.2
Fail
2.0
Fail
—
2.8
Fail
1.1
Fail
1.7
Fail
5.8
AA
2.8
Fail
—
2.7
Fail
5.0
AA
2.2
Fail
1.1
Fail
2.7
Fail
—
1.8
Fail
1.2
Fail
1.7
Fail
5.0
AA
1.8
Fail
—
White BG
1.3Fail
2.7Fail
7.6AAA
2.8Fail
1.5Fail
Black BG
16.1AAA
7.9AAA
2.8Fail
7.5AAA
13.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F18F
C0BF4F
59594A
70718D
C0C195

Deuteranopia

F3F596
C7CF53
5A5A4B
6A628F
BDB89B

Tritanopia

FDA3A8
EC5B5E
5D4C4D
479596
A9A9AD

Achromatopsia

DDDDDD
9A9A9A
545454
888888
C5C5C5

Shades & Tints Shades & Tints

#FFDF76

Dark
Light

#F27F40

Dark
Light

#5E5248

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffdf76;
  --color-2: #f27f40;
  --color-3: #5e5248;
  --color-4: #42ac83;
  --color-5: #a6e27d;
}

SCSS

$color-1: #ffdf76;
$color-2: #f27f40;
$color-3: #5e5248;
$color-4: #42ac83;
$color-5: #a6e27d;

TAILWIND

colors: {
  'brand-1': '#ffdf76',
  'brand-2': '#f27f40',
  'brand-3': '#5e5248',
  'brand-4': '#42ac83',
  'brand-5': '#a6e27d',
}

RGB Array

[255, 223, 118], [242, 127, 64], [94, 82, 72], [66, 172, 131], [166, 226, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFDF76, #F27F40, #5E5248, #42AC83, #A6E27D 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: #ffdf76; --color-2: #f27f40; --color-3: #5e5248; --color-4: #42ac83; --color-5: #a6e27d. 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