← Back to Editor

#FFBD87 · #FFD791 · #F7E8A6 · #D9E8AE · #BFE3C0

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

#FFBD87

Apricot · LightSalmon · Peach Orange

HEX
#FFBD87
RGB
rgb(255, 189, 135)
HSL
hsl(27, 100%, 76%)
HSB
hsb(27, 47%, 100%)
CMYK
cmyk(0%, 26%, 47%, 0%)
Oklch
oklch(84.7% 0.103 60.1)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#FFD791

Goose Yellow · Khaki · Peach Orange

HEX
#FFD791
RGB
rgb(255, 215, 145)
HSL
hsl(38, 100%, 78%)
HSB
hsb(38, 43%, 100%)
CMYK
cmyk(0%, 16%, 43%, 0%)
Oklch
oklch(89.8% 0.098 80.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#F7E8A6

Goose Yellow · Wheat · Lemon Cream

HEX
#F7E8A6
RGB
rgb(247, 232, 166)
HSL
hsl(49, 84%, 81%)
HSB
hsb(49, 33%, 97%)
CMYK
cmyk(0%, 6%, 33%, 3%)
Oklch
oklch(92.8% 0.085 96.9)

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

#D9E8AE

Willow Green · Wheat · Apple Green

HEX
#D9E8AE
RGB
rgb(217, 232, 174)
HSL
hsl(76, 56%, 80%)
HSB
hsb(76, 25%, 91%)
CMYK
cmyk(6%, 0%, 25%, 9%)
Oklch
oklch(90.5% 0.078 119.7)

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

#BFE3C0

Celadon · LightGray · Mint Green

HEX
#BFE3C0
RGB
rgb(191, 227, 192)
HSL
hsl(122, 39%, 82%)
HSB
hsb(122, 16%, 89%)
CMYK
cmyk(16%, 0%, 15%, 11%)
Oklch
oklch(88.0% 0.061 145.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFBD87
85C8FF

Analogous

FF858B
FFBD87
FFF985

Triadic

FFBD87
85FFBC
BC85FF

Split-Comp.

FFBD87
85FFF9
858BFF

Tetradic

FFBD87
8BFF85
85C8FF
F985FF

Contrast Matrix WCAG 2.1 Contrast

FFBD87
FFD791
F7E8A6
D9E8AE
BFE3C0
—
1.2
Fail
1.3
Fail
1.3
Fail
1.2
Fail
1.2
Fail
—
1.1
Fail
1.0
Fail
1.0
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.3
Fail
1.0
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.0
Fail
1.1
Fail
1.1
Fail
—
White BG
1.6Fail
1.4Fail
1.2Fail
1.3Fail
1.4Fail
Black BG
12.9AAA
15.4AAA
17.0AAA
16.1AAA
15.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E2E294
EEEDA2
F1F0B6
DFE0BC
CFCFC8

Deuteranopia

E6EB97
F0F3A6
F1F2BA
DFDDBF
CDCACA

Tritanopia

FC9EA1
FDAFB2
F6C3C5
DAC7CA
C1CFD1

Achromatopsia

CBCBCB
DBDBDB
E5E5E5
DDDDDD
D4D4D4

Shades & Tints Shades & Tints

#FFBD87

Dark
Light

#FFD791

Dark
Light

#F7E8A6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffbd87;
  --color-2: #ffd791;
  --color-3: #f7e8a6;
  --color-4: #d9e8ae;
  --color-5: #bfe3c0;
}

SCSS

$color-1: #ffbd87;
$color-2: #ffd791;
$color-3: #f7e8a6;
$color-4: #d9e8ae;
$color-5: #bfe3c0;

TAILWIND

colors: {
  'brand-1': '#ffbd87',
  'brand-2': '#ffd791',
  'brand-3': '#f7e8a6',
  'brand-4': '#d9e8ae',
  'brand-5': '#bfe3c0',
}

RGB Array

[255, 189, 135], [255, 215, 145], [247, 232, 166], [217, 232, 174], [191, 227, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFBD87, #FFD791, #F7E8A6, #D9E8AE, #BFE3C0 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: #ffbd87; --color-2: #ffd791; --color-3: #f7e8a6; --color-4: #d9e8ae; --color-5: #bfe3c0. 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