#FBDBC2 + #FCB9B1 + #E1A1B9 + #A889B2 + #97709D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FBDBC2

Apricot · Bisque · Peach Orange

HEX

#FBDBC2

RGB

rgb(251, 219, 194)

HSL

hsl(26, 88%, 87%)

HSB

hsb(26, 23%, 98%)

CMYK

cmyk(0%, 13%, 23%, 2%)

Oklch

oklch(91.2% 0.049 60.1)

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

#FCB9B1

Peach Pink · LightPink · Cherry Blossom

HEX

#FCB9B1

RGB

rgb(252, 185, 177)

HSL

hsl(6, 93%, 84%)

HSB

hsb(6, 30%, 99%)

CMYK

cmyk(0%, 27%, 30%, 1%)

Oklch

oklch(84.5% 0.079 26.5)

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

#E1A1B9

Rouge · LightPink · Cherry Blossom

HEX

#E1A1B9

RGB

rgb(225, 161, 185)

HSL

hsl(338, 52%, 76%)

HSB

hsb(338, 28%, 88%)

CMYK

cmyk(0%, 28%, 18%, 12%)

Oklch

oklch(77.7% 0.082 354.9)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#A889B2

Lilac · DarkGray · Lilac Purple

HEX

#A889B2

RGB

rgb(168, 137, 178)

HSL

hsl(285, 21%, 62%)

HSB

hsb(285, 23%, 70%)

CMYK

cmyk(6%, 23%, 0%, 30%)

Oklch

oklch(67.3% 0.069 317.8)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#97709D

Dark Plum · LightSlateGray · Violet

HEX

#97709D

RGB

rgb(151, 112, 157)

HSL

hsl(292, 19%, 53%)

HSB

hsb(292, 29%, 62%)

CMYK

cmyk(4%, 29%, 0%, 38%)

Oklch

oklch(60.0% 0.081 321.9)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBDBC2

C1E2FB

Analogous

FBC1C5

FBDBC2

FBF7C1

Triadic

FBDBC2

C1FBDA

DAC1FB

Split-Comp.

FBDBC2

C1FBF7

C1C5FB

Tetradic

FBDBC2

C5FBC1

C1E2FB

F7C1FB

Contrast Matrix WCAG 2.1 Contrast

FBDBC2	FCB9B1	E1A1B9	A889B2	97709D
—	1.3 Fail	1.6 Fail	2.3 Fail	3.1 AA Large
1.3 Fail	—	1.3 Fail	1.8 Fail	2.5 Fail
1.6 Fail	1.3 Fail	—	1.5 Fail	2.0 Fail
2.3 Fail	1.8 Fail	1.5 Fail	—	1.3 Fail
3.1 AA Large	2.5 Fail	2.0 Fail	1.3 Fail	—

White BG

1.3Fail

1.7Fail

2.1Fail

3.0AA Large

4.1AA Large

Black BG

16.0AAA

12.7AAA

10.0AAA

6.9AA

5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDC8

DFDEB3

C5C5B3

9B9AA8

868692

Deuteranopia

EFF1CA

E3E8B3

C9CEB2

9C9FA6

888B90

Tritanopia

F9CDCE

F9B4B5

DEAFAE

A6A09F

958A88

Achromatopsia

E2E2E2

CCCCCC

B7B7B7

979797

818181

Shades & Tints Shades & Tints

#FBDBC2

Dark

Light

#FCB9B1

Dark

Light

#E1A1B9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbdbc2;
  --color-2: #fcb9b1;
  --color-3: #e1a1b9;
  --color-4: #a889b2;
  --color-5: #97709d;
}

SCSS

$color-1: #fbdbc2;
$color-2: #fcb9b1;
$color-3: #e1a1b9;
$color-4: #a889b2;
$color-5: #97709d;

TAILWIND

colors: {
  'brand-1': '#fbdbc2',
  'brand-2': '#fcb9b1',
  'brand-3': '#e1a1b9',
  'brand-4': '#a889b2',
  'brand-5': '#97709d',
}

RGB Array

[251, 219, 194], [252, 185, 177], [225, 161, 185], [168, 137, 178], [151, 112, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FBDBC2, #FCB9B1, #E1A1B9, #A889B2, #97709D 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: #fbdbc2; --color-2: #fcb9b1; --color-3: #e1a1b9; --color-4: #a889b2; --color-5: #97709d. 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