← Back to Editor

#B2CAAA · #FFF5D7 · #FDB092 · #AE8F61

pastel

A 4-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

#B2CAAA

Celadon · Silver · Apple Green

HEX
#B2CAAA
RGB
rgb(178, 202, 170)
HSL
hsl(105, 23%, 73%)
HSB
hsb(105, 16%, 79%)
CMYK
cmyk(12%, 0%, 16%, 21%)
Oklch
oklch(81.2% 0.051 137.9)

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

#FFF5D7

Goose Yellow · Beige · Lemon Cream

HEX
#FFF5D7
RGB
rgb(255, 245, 215)
HSL
hsl(45, 100%, 92%)
HSB
hsb(45, 16%, 100%)
CMYK
cmyk(0%, 4%, 16%, 0%)
Oklch
oklch(97.0% 0.041 91.7)

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

#FDB092

Apricot · LightSalmon · Peach Orange

HEX
#FDB092
RGB
rgb(253, 176, 146)
HSL
hsl(17, 96%, 78%)
HSB
hsb(17, 42%, 99%)
CMYK
cmyk(0%, 30%, 42%, 1%)
Oklch
oklch(82.4% 0.100 42.1)

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

#AE8F61

Ginger · Gray · Warm Sun

HEX
#AE8F61
RGB
rgb(174, 143, 97)
HSL
hsl(36, 32%, 53%)
HSB
hsb(36, 44%, 68%)
CMYK
cmyk(0%, 18%, 44%, 32%)
Oklch
oklch(66.8% 0.073 76.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B2CAAA
C2AACA

Analogous

C2CAAA
B2CAAA
AACAB2

Triadic

B2CAAA
AAB2CA
CAAAB2

Split-Comp.

B2CAAA
B2AACA
CAAAC2

Tetradic

B2CAAA
AAC2CA
C2AACA
CAB2AA

Contrast Matrix WCAG 2.1 Contrast

B2CAAA
FFF5D7
FDB092
AE8F61
—
1.6
Fail
1.0
Fail
1.7
Fail
1.6
Fail
—
1.6
Fail
2.8
Fail
1.0
Fail
1.6
Fail
—
1.7
Fail
1.7
Fail
2.8
Fail
1.7
Fail
—
White BG
1.8Fail
1.1Fail
1.8Fail
3.0AA Large
Black BG
11.9AAA
19.3AAA
11.8AAA
6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBDB2
FBFBDE
DCDB99
A1A06C

Deuteranopia

BBB9B4
FBFCE0
E0E69B
A2A56F

Tritanopia

B3B8B9
FFE4E5
F99FA0
AC7577

Achromatopsia

BFBFBF
F5F5F5
C4C4C4
939393

Shades & Tints Shades & Tints

#B2CAAA

Dark
Light

#FFF5D7

Dark
Light

#FDB092

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b2caaa;
  --color-2: #fff5d7;
  --color-3: #fdb092;
  --color-4: #ae8f61;
}

SCSS

$color-1: #b2caaa;
$color-2: #fff5d7;
$color-3: #fdb092;
$color-4: #ae8f61;

TAILWIND

colors: {
  'brand-1': '#b2caaa',
  'brand-2': '#fff5d7',
  'brand-3': '#fdb092',
  'brand-4': '#ae8f61',
}

RGB Array

[178, 202, 170], [255, 245, 215], [253, 176, 146], [174, 143, 97]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This pastel-style palette of #B2CAAA, #FFF5D7, #FDB092, #AE8F61 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 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #b2caaa; --color-2: #fff5d7; --color-3: #fdb092; --color-4: #ae8f61. 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 4-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