← Back to Editor

#B2CDBA · #DFDDB6 · #F0E0AD · #FFECCD · #F5AFB7

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

#B2CDBA

Celadon · Silver · Apple Green

HEX
#B2CDBA
RGB
rgb(178, 205, 186)
HSL
hsl(138, 21%, 75%)
HSB
hsb(138, 13%, 80%)
CMYK
cmyk(13%, 0%, 9%, 20%)
Oklch
oklch(82.3% 0.039 154.8)

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

#DFDDB6

Fresh Green · Wheat · Lemon Cream

HEX
#DFDDB6
RGB
rgb(223, 221, 182)
HSL
hsl(57, 39%, 79%)
HSB
hsb(57, 18%, 87%)
CMYK
cmyk(0%, 1%, 18%, 13%)
Oklch
oklch(88.9% 0.052 105.0)

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

#F0E0AD

Goose Yellow · Wheat · Lemon Cream

HEX
#F0E0AD
RGB
rgb(240, 224, 173)
HSL
hsl(46, 69%, 81%)
HSB
hsb(46, 28%, 94%)
CMYK
cmyk(0%, 7%, 28%, 6%)
Oklch
oklch(90.7% 0.068 92.7)

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

#FFECCD

Goose Yellow · Bisque · Peach Orange

HEX
#FFECCD
RGB
rgb(255, 236, 205)
HSL
hsl(37, 100%, 90%)
HSB
hsb(37, 20%, 100%)
CMYK
cmyk(0%, 7%, 20%, 0%)
Oklch
oklch(95.0% 0.046 80.1)

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

#F5AFB7

Peach Pink · LightPink · Cherry Blossom

HEX
#F5AFB7
RGB
rgb(245, 175, 183)
HSL
hsl(353, 78%, 82%)
HSB
hsb(353, 29%, 96%)
CMYK
cmyk(0%, 29%, 25%, 4%)
Oklch
oklch(82.2% 0.083 11.5)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B2CDBA
CDB2C5

Analogous

B7CDB2
B2CDBA
B2CDC7

Triadic

B2CDBA
BAB2CD
CDBAB2

Split-Comp.

B2CDBA
C7B2CD
CDB2B7

Tetradic

B2CDBA
B2B7CD
CDB2C5
CDC7B2

Contrast Matrix WCAG 2.1 Contrast

B2CDBA
DFDDB6
F0E0AD
FFECCD
F5AFB7
—
1.2
Fail
1.3
Fail
1.5
Fail
1.1
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
1.3
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
1.5
Fail
1.2
Fail
1.1
Fail
—
1.5
Fail
1.1
Fail
1.3
Fail
1.4
Fail
1.5
Fail
—
White BG
1.7Fail
1.4Fail
1.3Fail
1.2Fail
1.8Fail
Black BG
12.3AAA
15.2AAA
16.0AAA
18.1AAA
11.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBEBF
DEDEBF
E9E9B9
F7F7D5
D7D6B5

Deuteranopia

BCBAC0
DEDEC2
EAEBBC
F8F9D6
DBE0B5

Tritanopia

B3C2C3
DFC7C9
EFC3C5
FEDADC
F2B4B3

Achromatopsia

C3C3C3
D9D9D9
DFDFDF
EEEEEE
C5C5C5

Shades & Tints Shades & Tints

#B2CDBA

Dark
Light

#DFDDB6

Dark
Light

#F0E0AD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b2cdba;
  --color-2: #dfddb6;
  --color-3: #f0e0ad;
  --color-4: #ffeccd;
  --color-5: #f5afb7;
}

SCSS

$color-1: #b2cdba;
$color-2: #dfddb6;
$color-3: #f0e0ad;
$color-4: #ffeccd;
$color-5: #f5afb7;

TAILWIND

colors: {
  'brand-1': '#b2cdba',
  'brand-2': '#dfddb6',
  'brand-3': '#f0e0ad',
  'brand-4': '#ffeccd',
  'brand-5': '#f5afb7',
}

RGB Array

[178, 205, 186], [223, 221, 182], [240, 224, 173], [255, 236, 205], [245, 175, 183]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B2CDBA, #DFDDB6, #F0E0AD, #FFECCD, #F5AFB7 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: #b2cdba; --color-2: #dfddb6; --color-3: #f0e0ad; --color-4: #ffeccd; --color-5: #f5afb7. 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