← Back to Editor

#FF8CA9 · #CBD7C3 · #F6F6F4 · #FDD8D0 · #AA4E7F

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 PostIllustrationData Visualization

Color Details Color Details

#FF8CA9

Peach Pink · LightCoral · Coral Red

HEX
#FF8CA9
RGB
rgb(255, 140, 169)
HSL
hsl(345, 100%, 77%)
HSB
hsb(345, 45%, 100%)
CMYK
cmyk(0%, 45%, 34%, 0%)
Oklch
oklch(77.2% 0.142 4.8)

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

#CBD7C3

Celadon · LightGray · Apple Green

HEX
#CBD7C3
RGB
rgb(203, 215, 195)
HSL
hsl(96, 20%, 80%)
HSB
hsb(96, 9%, 84%)
CMYK
cmyk(6%, 0%, 9%, 16%)
Oklch
oklch(86.4% 0.030 132.6)

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

#F6F6F4

Fresh Green · SeaShell · Lemon Cream

HEX
#F6F6F4
RGB
rgb(246, 246, 244)
HSL
hsl(60, 10%, 96%)
HSB
hsb(60, 1%, 96%)
CMYK
cmyk(0%, 0%, 1%, 4%)
Oklch
oklch(97.3% 0.003 106.4)

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

#FDD8D0

Peach Pink · Bisque · Cherry Blossom

HEX
#FDD8D0
RGB
rgb(253, 216, 208)
HSL
hsl(11, 92%, 90%)
HSB
hsb(11, 18%, 99%)
CMYK
cmyk(0%, 15%, 18%, 1%)
Oklch
oklch(91.1% 0.043 32.2)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#AA4E7F

Rose Purple · MediumVioletRed · Camellia

HEX
#AA4E7F
RGB
rgb(170, 78, 127)
HSL
hsl(328, 37%, 49%)
HSB
hsb(328, 54%, 67%)
CMYK
cmyk(0%, 54%, 25%, 33%)
Oklch
oklch(55.5% 0.133 349.2)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF8CA9
8AFFE2

Analogous

FF8AE2
FF8CA9
FFA78A

Triadic

FF8CA9
A7FF8A
8AA7FF

Split-Comp.

FF8CA9
8AFFA7
8AE2FF

Tetradic

FF8CA9
E2FF8A
8AFFE2
A78AFF

Contrast Matrix WCAG 2.1 Contrast

FF8CA9
CBD7C3
F6F6F4
FDD8D0
AA4E7F
—
1.5
Fail
2.0
Fail
1.7
Fail
2.3
Fail
1.5
Fail
—
1.4
Fail
1.1
Fail
3.4
AA Large
2.0
Fail
1.4
Fail
—
1.2
Fail
4.7
AA
1.7
Fail
1.1
Fail
1.2
Fail
—
3.9
AA Large
2.3
Fail
3.4
AA Large
4.7
AA
3.9
AA Large
—
White BG
2.2Fail
1.5Fail
1.1Fail
1.3Fail
5.1AA
Black BG
9.6AAA
14.0AAA
19.4AAA
15.9AAA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CDCCA2
D0D0C8
F6F6F4
EDEDD2
828173

Deuteranopia

D4DDA0
D0CFC9
F6F6F5
EFF2D2
888E70

Tritanopia

F99C9B
CCCCCD
F6F5F5
FBD3D4
A56A68

Achromatopsia

B2B2B2
D1D1D1
F6F6F6
E2E2E2
6F6F6F

Shades & Tints Shades & Tints

#FF8CA9

Dark
Light

#CBD7C3

Dark
Light

#F6F6F4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff8ca9;
  --color-2: #cbd7c3;
  --color-3: #f6f6f4;
  --color-4: #fdd8d0;
  --color-5: #aa4e7f;
}

SCSS

$color-1: #ff8ca9;
$color-2: #cbd7c3;
$color-3: #f6f6f4;
$color-4: #fdd8d0;
$color-5: #aa4e7f;

TAILWIND

colors: {
  'brand-1': '#ff8ca9',
  'brand-2': '#cbd7c3',
  'brand-3': '#f6f6f4',
  'brand-4': '#fdd8d0',
  'brand-5': '#aa4e7f',
}

RGB Array

[255, 140, 169], [203, 215, 195], [246, 246, 244], [253, 216, 208], [170, 78, 127]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #FF8CA9, #CBD7C3, #F6F6F4, #FDD8D0, #AA4E7F is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #ff8ca9; --color-2: #cbd7c3; --color-3: #f6f6f4; --color-4: #fdd8d0; --color-5: #aa4e7f. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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