← Back to Editor

#BFF2DB · #CCE8A5 · #F7D183 · #FFA78A · #FB7F9F

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

#BFF2DB

Jade · LightBlue · Mint Green

HEX
#BFF2DB
RGB
rgb(191, 242, 219)
HSL
hsl(153, 66%, 85%)
HSB
hsb(153, 21%, 95%)
CMYK
cmyk(21%, 0%, 10%, 5%)
Oklch
oklch(92.0% 0.061 165.8)

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

#CCE8A5

Willow Green · Khaki · Apple Green

HEX
#CCE8A5
RGB
rgb(204, 232, 165)
HSL
hsl(85, 59%, 78%)
HSB
hsb(85, 29%, 91%)
CMYK
cmyk(12%, 0%, 29%, 9%)
Oklch
oklch(89.4% 0.093 126.6)

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

#F7D183

Goose Yellow · Khaki · Sunflower

HEX
#F7D183
RGB
rgb(247, 209, 131)
HSL
hsl(40, 88%, 74%)
HSB
hsb(40, 47%, 97%)
CMYK
cmyk(0%, 15%, 47%, 3%)
Oklch
oklch(87.6% 0.106 84.4)

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

#FFA78A

Apricot · LightSalmon · Peach Orange

HEX
#FFA78A
RGB
rgb(255, 167, 138)
HSL
hsl(15, 100%, 77%)
HSB
hsb(15, 46%, 100%)
CMYK
cmyk(0%, 35%, 46%, 0%)
Oklch
oklch(80.9% 0.112 39.0)

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

#FB7F9F

Peach Pink · LightCoral · Coral Red

HEX
#FB7F9F
RGB
rgb(251, 127, 159)
HSL
hsl(345, 94%, 74%)
HSB
hsb(345, 49%, 98%)
CMYK
cmyk(0%, 49%, 37%, 2%)
Oklch
oklch(74.5% 0.154 5.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFF2DB
F2C0D6

Analogous

C0F2C2
BFF2DB
C0EFF2

Triadic

BFF2DB
DBC0F2
F2DBC0

Split-Comp.

BFF2DB
F2C0EF
F2C2C0

Tetradic

BFF2DB
C2C0F2
F2C0D6
EFF2C0

Contrast Matrix WCAG 2.1 Contrast

BFF2DB
CCE8A5
F7D183
FFA78A
FB7F9F
—
1.1
Fail
1.2
Fail
1.5
Fail
2.0
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
1.8
Fail
1.2
Fail
1.1
Fail
—
1.3
Fail
1.7
Fail
1.5
Fail
1.4
Fail
1.3
Fail
—
1.3
Fail
2.0
Fail
1.8
Fail
1.7
Fail
1.3
Fail
—
White BG
1.2Fail
1.3Fail
1.5Fail
1.9Fail
2.4Fail
Black BG
16.9AAA
15.7AAA
14.4AAA
11.1AAA
8.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D5D6E1
D8D8B5
E7E696
D9D891
C5C497

Deuteranopia

D2CEE2
D7D4B9
E9EC9A
DEE593
CDD695

Tritanopia

C2E5E6
CDC2C5
F5A5A8
FB9798
F59190

Achromatopsia

E0E0E0
D8D8D8
D3D3D3
BEBEBE
A8A8A8

Shades & Tints Shades & Tints

#BFF2DB

Dark
Light

#CCE8A5

Dark
Light

#F7D183

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bff2db;
  --color-2: #cce8a5;
  --color-3: #f7d183;
  --color-4: #ffa78a;
  --color-5: #fb7f9f;
}

SCSS

$color-1: #bff2db;
$color-2: #cce8a5;
$color-3: #f7d183;
$color-4: #ffa78a;
$color-5: #fb7f9f;

TAILWIND

colors: {
  'brand-1': '#bff2db',
  'brand-2': '#cce8a5',
  'brand-3': '#f7d183',
  'brand-4': '#ffa78a',
  'brand-5': '#fb7f9f',
}

RGB Array

[191, 242, 219], [204, 232, 165], [247, 209, 131], [255, 167, 138], [251, 127, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BFF2DB, #CCE8A5, #F7D183, #FFA78A, #FB7F9F 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: #bff2db; --color-2: #cce8a5; --color-3: #f7d183; --color-4: #ffa78a; --color-5: #fb7f9f. 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