#F5D7CD + #FBB1B2 + #B89C99 + #FE829C + #AE8A8C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F5D7CD

Apricot · Bisque · Peach Orange

HEX

#F5D7CD

RGB

rgb(245, 215, 205)

HSL

hsl(15, 67%, 88%)

HSB

hsb(15, 16%, 96%)

CMYK

cmyk(0%, 12%, 16%, 4%)

Oklch

oklch(90.1% 0.036 39.3)

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

#FBB1B2

Peach Pink · LightPink · Cherry Blossom

HEX

#FBB1B2

RGB

rgb(251, 177, 178)

HSL

hsl(359, 90%, 84%)

HSB

hsb(359, 29%, 98%)

CMYK

cmyk(0%, 29%, 29%, 2%)

Oklch

oklch(83.1% 0.087 18.2)

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

#B89C99

Peach Pink · DarkGray · Coral Red

HEX

#B89C99

RGB

rgb(184, 156, 153)

HSL

hsl(6, 18%, 66%)

HSB

hsb(6, 17%, 72%)

CMYK

cmyk(0%, 15%, 17%, 28%)

Oklch

oklch(71.7% 0.034 25.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FE829C

Peach Pink · LightCoral · Coral Red

HEX

#FE829C

RGB

rgb(254, 130, 156)

HSL

hsl(347, 98%, 75%)

HSB

hsb(347, 49%, 100%)

CMYK

cmyk(0%, 49%, 39%, 0%)

Oklch

oklch(75.3% 0.152 8.2)

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

#AE8A8C

Peach Pink · DarkGray · Coral Red

HEX

#AE8A8C

RGB

rgb(174, 138, 140)

HSL

hsl(357, 18%, 61%)

HSB

hsb(357, 21%, 68%)

CMYK

cmyk(0%, 21%, 20%, 32%)

Oklch

oklch(66.8% 0.044 14.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F5D7CD

CCEBF5

Analogous

F5CCD6

F5D7CD

F5EBCC

Triadic

F5D7CD

CCF5D6

D6CCF5

Split-Comp.

F5D7CD

CCF5EB

CCD6F5

Tetradic

F5D7CD

D6F5CC

CCEBF5

EBCCF5

Contrast Matrix WCAG 2.1 Contrast

F5D7CD	FBB1B2	B89C99	FE829C	AE8A8C
—	1.3 Fail	1.9 Fail	1.7 Fail	2.3 Fail
1.3 Fail	—	1.5 Fail	1.4 Fail	1.8 Fail
1.9 Fail	1.5 Fail	—	1.1 Fail	1.2 Fail
1.7 Fail	1.4 Fail	1.1 Fail	—	1.3 Fail
2.3 Fail	1.8 Fail	1.2 Fail	1.3 Fail	—

White BG

1.4Fail

1.7Fail

2.5Fail

2.4Fail

3.1AA Large

Black BG

15.5AAA

12.0AAA

8.3AAA

8.9AAA

6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8CF

DBDAB2

ACAC9A

C8C796

9E9E8C

Deuteranopia

EAECD0

DFE5B2

AEB09A

D0D994

A1A38B

Tritanopia

F4D1D2

F7B2B2

B79A9A

F89190

AC8B8B

Achromatopsia

DFDFDF

C7C7C7

A4A4A4

AAAAAA

959595

Shades & Tints Shades & Tints

#F5D7CD

Dark

Light

#FBB1B2

Dark

Light

#B89C99

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f5d7cd;
  --color-2: #fbb1b2;
  --color-3: #b89c99;
  --color-4: #fe829c;
  --color-5: #ae8a8c;
}

SCSS

$color-1: #f5d7cd;
$color-2: #fbb1b2;
$color-3: #b89c99;
$color-4: #fe829c;
$color-5: #ae8a8c;

TAILWIND

colors: {
  'brand-1': '#f5d7cd',
  'brand-2': '#fbb1b2',
  'brand-3': '#b89c99',
  'brand-4': '#fe829c',
  'brand-5': '#ae8a8c',
}

RGB Array

[245, 215, 205], [251, 177, 178], [184, 156, 153], [254, 130, 156], [174, 138, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F5D7CD, #FBB1B2, #B89C99, #FE829C, #AE8A8C 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: #f5d7cd; --color-2: #fbb1b2; --color-3: #b89c99; --color-4: #fe829c; --color-5: #ae8a8c. 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 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