#FABAB4 + #FFD6D2 + #CAC8C4 + #9AB2B5 + #78929C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FABAB4

Peach Pink · LightPink · Cherry Blossom

HEX

#FABAB4

RGB

rgb(250, 186, 180)

HSL

hsl(5, 88%, 84%)

HSB

hsb(5, 28%, 98%)

CMYK

cmyk(0%, 26%, 28%, 2%)

Oklch

oklch(84.6% 0.075 24.9)

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

#FFD6D2

Peach Pink · Bisque · Cherry Blossom

HEX

#FFD6D2

RGB

rgb(255, 214, 210)

HSL

hsl(5, 100%, 91%)

HSB

hsb(5, 18%, 100%)

CMYK

cmyk(0%, 16%, 18%, 0%)

Oklch

oklch(91.0% 0.046 24.6)

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

#CAC8C4

Silver Gray · Silver · Pearl Gray

HEX

#CAC8C4

RGB

rgb(202, 200, 196)

HSL

hsl(40, 5%, 78%)

HSB

hsb(40, 3%, 79%)

CMYK

cmyk(0%, 1%, 3%, 21%)

Oklch

oklch(83.3% 0.006 84.6)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#9AB2B5

Sky Blue · DarkGray · Lake Green

HEX

#9AB2B5

RGB

rgb(154, 178, 181)

HSL

hsl(187, 15%, 66%)

HSB

hsb(187, 15%, 71%)

CMYK

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

Oklch

oklch(74.6% 0.027 205.8)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#78929C

Slate Blue · LightSlateGray · Lake Green

HEX

#78929C

RGB

rgb(120, 146, 156)

HSL

hsl(197, 15%, 54%)

HSB

hsb(197, 23%, 61%)

CMYK

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

Oklch

oklch(64.3% 0.033 223.2)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FABAB4

B2F4FA

Analogous

FAB2D0

FABAB4

FADCB2

Triadic

FABAB4

B2FAB8

B8B2FA

Split-Comp.

FABAB4

B2FADC

B2D0FA

Tetradic

FABAB4

D0FAB2

B2F4FA

DCB2FA

Contrast Matrix WCAG 2.1 Contrast

FABAB4	FFD6D2	CAC8C4	9AB2B5	78929C
—	1.2 Fail	1.0 Fail	1.4 Fail	2.0 Fail
1.2 Fail	—	1.3 Fail	1.7 Fail	2.5 Fail
1.0 Fail	1.3 Fail	—	1.3 Fail	2.0 Fail
1.4 Fail	1.7 Fail	1.3 Fail	—	1.5 Fail
2.0 Fail	2.5 Fail	2.0 Fail	1.5 Fail	—

White BG

1.6Fail

1.3Fail

1.7Fail

2.2Fail

3.3AA Large

Black BG

12.7AAA

15.8AAA

12.6AAA

9.4AAA

6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDEB5

EDEDD3

C9C9C5

A4A5B4

83839A

Deuteranopia

E2E7B6

F0F3D3

C9C9C5

A3A1B4

828099

Tritanopia

F7B7B7

FDD4D4

CAC6C6

9BB4B4

799897

Achromatopsia

CCCCCC

E2E2E2

C8C8C8

ABABAB

8B8B8B

Shades & Tints Shades & Tints

#FABAB4

Dark

Light

#FFD6D2

Dark

Light

#CAC8C4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fabab4;
  --color-2: #ffd6d2;
  --color-3: #cac8c4;
  --color-4: #9ab2b5;
  --color-5: #78929c;
}

SCSS

$color-1: #fabab4;
$color-2: #ffd6d2;
$color-3: #cac8c4;
$color-4: #9ab2b5;
$color-5: #78929c;

TAILWIND

colors: {
  'brand-1': '#fabab4',
  'brand-2': '#ffd6d2',
  'brand-3': '#cac8c4',
  'brand-4': '#9ab2b5',
  'brand-5': '#78929c',
}

RGB Array

[250, 186, 180], [255, 214, 210], [202, 200, 196], [154, 178, 181], [120, 146, 156]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FABAB4, #FFD6D2, #CAC8C4, #9AB2B5, #78929C 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: #fabab4; --color-2: #ffd6d2; --color-3: #cac8c4; --color-4: #9ab2b5; --color-5: #78929c. 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