← Back to Editor

#FEFAD9 · #F8E5B4 · #DEDABD · #D3C7B9 · #BB8D9A

pastel

A 5-color pastel palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#FEFAD9

Fresh Green · LightYellow · Lemon Cream

HEX
#FEFAD9
RGB
rgb(254, 250, 217)
HSL
hsl(54, 95%, 92%)
HSB
hsb(54, 15%, 100%)
CMYK
cmyk(0%, 2%, 15%, 0%)
Oklch
oklch(98.0% 0.043 101.5)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#F8E5B4

Goose Yellow · Wheat · Lemon Cream

HEX
#F8E5B4
RGB
rgb(248, 229, 180)
HSL
hsl(43, 83%, 84%)
HSB
hsb(43, 27%, 97%)
CMYK
cmyk(0%, 8%, 27%, 3%)
Oklch
oklch(92.5% 0.067 89.3)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#DEDABD

Fresh Green · Wheat · Lemon Cream

HEX
#DEDABD
RGB
rgb(222, 218, 189)
HSL
hsl(53, 33%, 81%)
HSB
hsb(53, 15%, 87%)
CMYK
cmyk(0%, 2%, 15%, 13%)
Oklch
oklch(88.4% 0.039 100.7)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#D3C7B9

Goose Yellow · Silver · Peach Orange

HEX
#D3C7B9
RGB
rgb(211, 199, 185)
HSL
hsl(32, 23%, 78%)
HSB
hsb(32, 12%, 83%)
CMYK
cmyk(0%, 6%, 12%, 17%)
Oklch
oklch(83.6% 0.023 71.7)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#BB8D9A

Rouge · DarkGray · Rose Pink

HEX
#BB8D9A
RGB
rgb(187, 141, 154)
HSL
hsl(343, 25%, 64%)
HSB
hsb(343, 25%, 73%)
CMYK
cmyk(0%, 25%, 18%, 27%)
Oklch
oklch(69.1% 0.058 0.1)

TraditionalRouge」· PaintRose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FEFAD9
D7DBFE

Analogous

FEE7D7
FEFAD9
EEFED7

Triadic

FEFAD9
D7FEFA
FAD7FE

Split-Comp.

FEFAD9
D7EEFE
E7D7FE

Tetradic

FEFAD9
D7FEE7
D7DBFE
FED7EE

Contrast Matrix WCAG 2.1 Contrast

FEFAD9
F8E5B4
DEDABD
D3C7B9
BB8D9A
1.2
Fail
1.3
Fail
1.6
Fail
2.7
Fail
1.2
Fail
1.1
Fail
1.3
Fail
2.3
Fail
1.3
Fail
1.1
Fail
1.2
Fail
2.0
Fail
1.6
Fail
1.3
Fail
1.2
Fail
1.7
Fail
2.7
Fail
2.3
Fail
2.0
Fail
1.7
Fail
White BG
1.1Fail
1.2Fail
1.4Fail
1.7Fail
2.8Fail
Black BG
19.9AAA
16.9AAA
14.9AAA
12.6AAA
7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FCFCE1
F0F0C0
DCDCC4
CECEBC
A7A797

Deuteranopia

FDFDE3
F1F2C3
DDDDC6
CFCFBD
AAAD96

Tritanopia

FEE7E9
F7C9CB
DECACB
D2BFC0
B99494

Achromatopsia

F7F7F7
E5E5E5
D8D8D8
C9C9C9
9C9C9C

Shades & Tints Shades & Tints

#FEFAD9

Dark
Light

#F8E5B4

Dark
Light

#DEDABD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fefad9;
  --color-2: #f8e5b4;
  --color-3: #dedabd;
  --color-4: #d3c7b9;
  --color-5: #bb8d9a;
}

SCSS

$color-1: #fefad9;
$color-2: #f8e5b4;
$color-3: #dedabd;
$color-4: #d3c7b9;
$color-5: #bb8d9a;

TAILWIND

colors: {
  'brand-1': '#fefad9',
  'brand-2': '#f8e5b4',
  'brand-3': '#dedabd',
  'brand-4': '#d3c7b9',
  'brand-5': '#bb8d9a',
}

RGB Array

[254, 250, 217], [248, 229, 180], [222, 218, 189], [211, 199, 185], [187, 141, 154]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #FEFAD9, #F8E5B4, #DEDABD, #D3C7B9, #BB8D9A is ideal for: health products, baby brands, fresh-style blogs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #fefad9; --color-2: #f8e5b4; --color-3: #dedabd; --color-4: #d3c7b9; --color-5: #bb8d9a. 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 pastel-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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