#FAC9BE + #D7C0C1 + #B3B7C4 + #97A8E2 + #7A99FA - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FAC9BE

Peach Pink · Pink · Cherry Blossom

HEX

#FAC9BE

RGB

rgb(250, 201, 190)

HSL

hsl(11, 86%, 86%)

HSB

hsb(11, 24%, 98%)

CMYK

cmyk(0%, 20%, 24%, 2%)

Oklch

oklch(87.6% 0.058 32.8)

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

#D7C0C1

Peach Pink · Silver · Coral Red

HEX

#D7C0C1

RGB

rgb(215, 192, 193)

HSL

hsl(357, 22%, 80%)

HSB

hsb(357, 11%, 84%)

CMYK

cmyk(0%, 11%, 10%, 16%)

Oklch

oklch(82.7% 0.026 14.7)

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

#B3B7C4

Azure · Silver · Cobalt Blue

HEX

#B3B7C4

RGB

rgb(179, 183, 196)

HSL

hsl(226, 13%, 74%)

HSB

hsb(226, 9%, 77%)

CMYK

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

Oklch

oklch(78.0% 0.019 272.3)

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

#97A8E2

Azure · LightSteelBlue · Cobalt Blue

HEX

#97A8E2

RGB

rgb(151, 168, 226)

HSL

hsl(226, 56%, 74%)

HSB

hsb(226, 33%, 89%)

CMYK

cmyk(33%, 26%, 0%, 11%)

Oklch

oklch(74.0% 0.086 271.6)

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

#7A99FA

Azure · CornflowerBlue · Cobalt Blue

HEX

#7A99FA

RGB

rgb(122, 153, 250)

HSL

hsl(225, 93%, 73%)

HSB

hsb(225, 51%, 98%)

CMYK

cmyk(51%, 39%, 0%, 2%)

Oklch

oklch(70.2% 0.147 269.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAC9BE

BDEFFA

Analogous

FABDD0

FAC9BE

FAE7BD

Triadic

FAC9BE

BDFAC8

C8BDFA

Split-Comp.

FAC9BE

BDFAE7

BDD0FA

Tetradic

FAC9BE

D0FABD

BDEFFA

E7BDFA

Contrast Matrix WCAG 2.1 Contrast

FAC9BE	D7C0C1	B3B7C4	97A8E2	7A99FA
—	1.2 Fail	1.4 Fail	1.6 Fail	1.8 Fail
1.2 Fail	—	1.2 Fail	1.4 Fail	1.6 Fail
1.4 Fail	1.2 Fail	—	1.2 Fail	1.4 Fail
1.6 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
1.8 Fail	1.6 Fail	1.4 Fail	1.2 Fail	—

White BG

1.5Fail

1.7Fail

2.0Fail

2.3Fail

2.7Fail

Black BG

14.2AAA

12.2AAA

10.5AAA

9.0AAA

7.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E4C1

CDCDC1

B5B5C1

9E9FD4

8788E3

Deuteranopia

E8EBC1

CED0C1

B5B4C0

9D9CD1

8683DD

Tritanopia

F8C3C3

D6C1C1

B3BEBE

98C9C6

7CD0CC

Achromatopsia

D6D6D6

C7C7C7

B7B7B7

AAAAAA

9B9B9B

Shades & Tints Shades & Tints

#FAC9BE

Dark

Light

#D7C0C1

Dark

Light

#B3B7C4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fac9be;
  --color-2: #d7c0c1;
  --color-3: #b3b7c4;
  --color-4: #97a8e2;
  --color-5: #7a99fa;
}

SCSS

$color-1: #fac9be;
$color-2: #d7c0c1;
$color-3: #b3b7c4;
$color-4: #97a8e2;
$color-5: #7a99fa;

TAILWIND

colors: {
  'brand-1': '#fac9be',
  'brand-2': '#d7c0c1',
  'brand-3': '#b3b7c4',
  'brand-4': '#97a8e2',
  'brand-5': '#7a99fa',
}

RGB Array

[250, 201, 190], [215, 192, 193], [179, 183, 196], [151, 168, 226], [122, 153, 250]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAC9BE, #D7C0C1, #B3B7C4, #97A8E2, #7A99FA 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: #fac9be; --color-2: #d7c0c1; --color-3: #b3b7c4; --color-4: #97a8e2; --color-5: #7a99fa. 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