← Back to Editor

#D8DF71 · #FFB026 · #F76104 · #FD2001 · #81CEE6

cool

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

#D8DF71

Fresh Green · Khaki · Sunflower

HEX
#D8DF71
RGB
rgb(216, 223, 113)
HSL
hsl(64, 63%, 66%)
HSB
hsb(64, 49%, 87%)
CMYK
cmyk(3%, 0%, 49%, 13%)
Oklch
oklch(87.6% 0.134 112.1)

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

#FFB026

Ginger · GoldenRod · Warm Sun

HEX
#FFB026
RGB
rgb(255, 176, 38)
HSL
hsl(38, 100%, 57%)
HSB
hsb(38, 85%, 100%)
CMYK
cmyk(0%, 31%, 85%, 0%)
Oklch
oklch(81.3% 0.163 74.6)

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

#F76104

Tangerine · OrangeRed · Amber Brown

HEX
#F76104
RGB
rgb(247, 97, 4)
HSL
hsl(23, 97%, 49%)
HSB
hsb(23, 98%, 97%)
CMYK
cmyk(0%, 61%, 98%, 3%)
Oklch
oklch(67.7% 0.200 42.8)

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

#FD2001

Vermilion · Red · Passion Red

HEX
#FD2001
RGB
rgb(253, 32, 1)
HSL
hsl(7, 99%, 50%)
HSB
hsb(7, 100%, 99%)
CMYK
cmyk(0%, 87%, 100%, 1%)
Oklch
oklch(63.2% 0.248 30.7)

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

#81CEE6

Sky Blue · SkyBlue · Lake Green

HEX
#81CEE6
RGB
rgb(129, 206, 230)
HSL
hsl(194, 67%, 70%)
HSB
hsb(194, 44%, 90%)
CMYK
cmyk(44%, 10%, 0%, 10%)
Oklch
oklch(81.0% 0.083 219.8)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8DF71
7972DF

Analogous

DFB072
D8DF71
A1DF72

Triadic

D8DF71
72D8DF
DF72D8

Split-Comp.

D8DF71
72A1DF
B072DF

Tetradic

D8DF71
72DFB0
7972DF
DF72A1

Contrast Matrix WCAG 2.1 Contrast

D8DF71
FFB026
F76104
FD2001
81CEE6
—
1.3
Fail
2.2
Fail
2.7
Fail
1.2
Fail
1.3
Fail
—
1.7
Fail
2.1
Fail
1.0
Fail
2.2
Fail
1.7
Fail
—
1.2
Fail
1.8
Fail
2.7
Fail
2.1
Fail
1.2
Fail
—
2.2
Fail
1.2
Fail
1.0
Fail
1.8
Fail
2.2
Fail
—
White BG
1.4Fail
1.8Fail
3.2AA Large
3.9AA Large
1.8Fail
Black BG
14.7AAA
11.5AAA
6.7AA
5.4AA
11.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDB8C
DDDC47
B6B51B
9D9B09
A2A3E0

Deuteranopia

DBDA92
E1E74F
BFCA20
AABB0A
9E98DF

Tritanopia

D8A1A5
FB6268
EF2C30
F20E10
85DCDB

Achromatopsia

D0D0D0
B8B8B8
838383
5F5F5F
BABABA

Shades & Tints Shades & Tints

#D8DF71

Dark
Light

#FFB026

Dark
Light

#F76104

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8df71;
  --color-2: #ffb026;
  --color-3: #f76104;
  --color-4: #fd2001;
  --color-5: #81cee6;
}

SCSS

$color-1: #d8df71;
$color-2: #ffb026;
$color-3: #f76104;
$color-4: #fd2001;
$color-5: #81cee6;

TAILWIND

colors: {
  'brand-1': '#d8df71',
  'brand-2': '#ffb026',
  'brand-3': '#f76104',
  'brand-4': '#fd2001',
  'brand-5': '#81cee6',
}

RGB Array

[216, 223, 113], [255, 176, 38], [247, 97, 4], [253, 32, 1], [129, 206, 230]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #D8DF71, #FFB026, #F76104, #FD2001, #81CEE6 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: #d8df71; --color-2: #ffb026; --color-3: #f76104; --color-4: #fd2001; --color-5: #81cee6. 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 cool-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