← Back to Editor

#87FDE7 · #DFFCAD · #E5CD4B · #FC8236 · #F75A3C

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

#87FDE7

Jade · SkyBlue · Glacier Blue

HEX
#87FDE7
RGB
rgb(135, 253, 231)
HSL
hsl(169, 97%, 76%)
HSB
hsb(169, 47%, 99%)
CMYK
cmyk(47%, 0%, 9%, 1%)
Oklch
oklch(91.9% 0.112 180.1)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#DFFCAD

Willow Green · Wheat · Mint Green

HEX
#DFFCAD
RGB
rgb(223, 252, 173)
HSL
hsl(82, 93%, 83%)
HSB
hsb(82, 31%, 99%)
CMYK
cmyk(12%, 0%, 31%, 1%)
Oklch
oklch(95.2% 0.106 124.7)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#E5CD4B

Autumn Sage · SandyBrown · Sunflower

HEX
#E5CD4B
RGB
rgb(229, 205, 75)
HSL
hsl(51, 75%, 60%)
HSB
hsb(51, 67%, 90%)
CMYK
cmyk(0%, 10%, 67%, 10%)
Oklch
oklch(84.5% 0.148 98.7)

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

#FC8236

Tangerine · Coral · Warm Sun

HEX
#FC8236
RGB
rgb(252, 130, 54)
HSL
hsl(23, 97%, 60%)
HSB
hsb(23, 79%, 99%)
CMYK
cmyk(0%, 48%, 79%, 1%)
Oklch
oklch(73.3% 0.172 48.8)

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

#F75A3C

Vermilion · Tomato · Passion Red

HEX
#F75A3C
RGB
rgb(247, 90, 60)
HSL
hsl(10, 92%, 60%)
HSB
hsb(10, 76%, 97%)
CMYK
cmyk(0%, 64%, 76%, 3%)
Oklch
oklch(67.2% 0.198 32.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

87FDE7
FD869C

Analogous

86FDAC
87FDE7
86D8FD

Triadic

87FDE7
E786FD
FDE786

Split-Comp.

87FDE7
FD86D8
FDAC86

Tetradic

87FDE7
AC86FD
FD869C
D8FD86

Contrast Matrix WCAG 2.1 Contrast

87FDE7
DFFCAD
E5CD4B
FC8236
F75A3C
—
1.1
Fail
1.3
Fail
2.1
Fail
2.7
Fail
1.1
Fail
—
1.4
Fail
2.2
Fail
2.9
Fail
1.3
Fail
1.4
Fail
—
1.6
Fail
2.0
Fail
2.1
Fail
2.2
Fail
1.6
Fail
—
1.3
Fail
2.7
Fail
2.9
Fail
2.0
Fail
1.3
Fail
—
White BG
1.2Fail
1.1Fail
1.6Fail
2.5Fail
3.2AA Large
Black BG
17.2AAA
18.7AAA
13.2AAA
8.4AAA
6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BABBEC
ECECC0
DBDA6A
C7C648
B3B243

Deuteranopia

B3AAEE
EAE8C5
DCDE72
CED74D
BCC845

Tritanopia

8DF1F1
E0CFD3
E48389
F6575A
EF494A

Achromatopsia

D7D7D7
EAEAEA
C5C5C5
9E9E9E
868686

Shades & Tints Shades & Tints

#87FDE7

Dark
Light

#DFFCAD

Dark
Light

#E5CD4B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #87fde7;
  --color-2: #dffcad;
  --color-3: #e5cd4b;
  --color-4: #fc8236;
  --color-5: #f75a3c;
}

SCSS

$color-1: #87fde7;
$color-2: #dffcad;
$color-3: #e5cd4b;
$color-4: #fc8236;
$color-5: #f75a3c;

TAILWIND

colors: {
  'brand-1': '#87fde7',
  'brand-2': '#dffcad',
  'brand-3': '#e5cd4b',
  'brand-4': '#fc8236',
  'brand-5': '#f75a3c',
}

RGB Array

[135, 253, 231], [223, 252, 173], [229, 205, 75], [252, 130, 54], [247, 90, 60]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #87FDE7, #DFFCAD, #E5CD4B, #FC8236, #F75A3C 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: #87fde7; --color-2: #dffcad; --color-3: #e5cd4b; --color-4: #fc8236; --color-5: #f75a3c. 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