#FAC4DB + #F6D9CB + #9B94A8 + #B3ABC4 + #BBC4D6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FAC4DB

Rouge · Pink · Cherry Blossom

HEX

#FAC4DB

RGB

rgb(250, 196, 219)

HSL

hsl(334, 84%, 87%)

HSB

hsb(334, 22%, 98%)

CMYK

cmyk(0%, 22%, 12%, 2%)

Oklch

oklch(87.5% 0.068 351.2)

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

#F6D9CB

Apricot · Bisque · Peach Orange

HEX

#F6D9CB

RGB

rgb(246, 217, 203)

HSL

hsl(20, 70%, 88%)

HSB

hsb(20, 17%, 96%)

CMYK

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

Oklch

oklch(90.6% 0.038 47.4)

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

#9B94A8

Wisteria · DarkGray · Lilac Purple

HEX

#9B94A8

RGB

rgb(155, 148, 168)

HSL

hsl(261, 10%, 62%)

HSB

hsb(261, 12%, 66%)

CMYK

cmyk(8%, 12%, 0%, 34%)

Oklch

oklch(67.9% 0.030 301.5)

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

#B3ABC4

Wisteria · Silver · Cobalt Blue

HEX

#B3ABC4

RGB

rgb(179, 171, 196)

HSL

hsl(259, 17%, 72%)

HSB

hsb(259, 13%, 77%)

CMYK

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

Oklch

oklch(75.6% 0.036 300.1)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#BBC4D6

Azure · LightSteelBlue · Cobalt Blue

HEX

#BBC4D6

RGB

rgb(187, 196, 214)

HSL

hsl(220, 25%, 79%)

HSB

hsb(220, 13%, 84%)

CMYK

cmyk(13%, 8%, 0%, 16%)

Oklch

oklch(81.9% 0.027 264.4)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAC4DB

C2FAE2

Analogous

FAC2F6

FAC4DB

FAC6C2

Triadic

FAC4DB

DAFAC2

C2DAFA

Split-Comp.

FAC4DB

C2FAC6

C2F6FA

Tetradic

FAC4DB

F6FAC2

C2FAE2

C6C2FA

Contrast Matrix WCAG 2.1 Contrast

FAC4DB	F6D9CB	9B94A8	B3ABC4	BBC4D6
—	1.1 Fail	1.9 Fail	1.5 Fail	1.2 Fail
1.1 Fail	—	2.2 Fail	1.6 Fail	1.3 Fail
1.9 Fail	2.2 Fail	—	1.3 Fail	1.7 Fail
1.5 Fail	1.6 Fail	1.3 Fail	—	1.3 Fail
1.2 Fail	1.3 Fail	1.7 Fail	1.3 Fail	—

White BG

1.5Fail

1.3Fail

2.9Fail

2.2Fail

1.8Fail

Black BG

14.0AAA

15.7AAA

7.2AAA

9.5AAA

12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E3E2D5

E9E9CE

9898A3

B0AFBE

BFBFD2

Deuteranopia

E6EAD4

EBEDCF

9899A2

B0B1BD

BEBED1

Tritanopia

F7D1D0

F5D1D2

9B9F9F

B3B9B8

BBCECD

Achromatopsia

D7D7D7

E0E0E0

989898

B0B0B0

C3C3C3

Shades & Tints Shades & Tints

#FAC4DB

Dark

Light

#F6D9CB

Dark

Light

#9B94A8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fac4db;
  --color-2: #f6d9cb;
  --color-3: #9b94a8;
  --color-4: #b3abc4;
  --color-5: #bbc4d6;
}

SCSS

$color-1: #fac4db;
$color-2: #f6d9cb;
$color-3: #9b94a8;
$color-4: #b3abc4;
$color-5: #bbc4d6;

TAILWIND

colors: {
  'brand-1': '#fac4db',
  'brand-2': '#f6d9cb',
  'brand-3': '#9b94a8',
  'brand-4': '#b3abc4',
  'brand-5': '#bbc4d6',
}

RGB Array

[250, 196, 219], [246, 217, 203], [155, 148, 168], [179, 171, 196], [187, 196, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAC4DB, #F6D9CB, #9B94A8, #B3ABC4, #BBC4D6 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: #fac4db; --color-2: #f6d9cb; --color-3: #9b94a8; --color-4: #b3abc4; --color-5: #bbc4d6. 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