#FBE1C6 + #F8C5B2 + #F49BAF + #A68C97 + #86B5AF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FBE1C6

Goose Yellow · Bisque · Peach Orange

HEX

#FBE1C6

RGB

rgb(251, 225, 198)

HSL

hsl(31, 87%, 88%)

HSB

hsb(31, 21%, 98%)

CMYK

cmyk(0%, 10%, 21%, 2%)

Oklch

oklch(92.4% 0.046 68.3)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#F8C5B2

Apricot · LightPink · Peach Orange

HEX

#F8C5B2

RGB

rgb(248, 197, 178)

HSL

hsl(16, 83%, 84%)

HSB

hsb(16, 28%, 97%)

CMYK

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

Oklch

oklch(86.4% 0.064 41.4)

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

#F49BAF

Peach Pink · LightPink · Coral Red

HEX

#F49BAF

RGB

rgb(244, 155, 175)

HSL

hsl(347, 80%, 78%)

HSB

hsb(347, 36%, 96%)

CMYK

cmyk(0%, 36%, 28%, 4%)

Oklch

oklch(78.4% 0.109 5.3)

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

#A68C97

Dark Violet · DarkGray · Rose Pink

HEX

#A68C97

RGB

rgb(166, 140, 151)

HSL

hsl(335, 13%, 60%)

HSB

hsb(335, 16%, 65%)

CMYK

cmyk(0%, 16%, 9%, 35%)

Oklch

oklch(66.7% 0.035 350.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#86B5AF

Jade · DarkSeaGreen · Lake Green

HEX

#86B5AF

RGB

rgb(134, 181, 175)

HSL

hsl(172, 24%, 62%)

HSB

hsb(172, 26%, 71%)

CMYK

cmyk(26%, 0%, 3%, 29%)

Oklch

oklch(73.8% 0.051 186.4)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBE1C6

C6E0FB

Analogous

FBC7C6

FBE1C6

FAFBC6

Triadic

FBE1C6

C6FBE1

E1C6FB

Split-Comp.

FBE1C6

C6FAFB

C7C6FB

Tetradic

FBE1C6

C6FBC7

C6E0FB

FBC6FA

Contrast Matrix WCAG 2.1 Contrast

FBE1C6	F8C5B2	F49BAF	A68C97	86B5AF
—	1.2 Fail	1.6 Fail	2.4 Fail	1.8 Fail
1.2 Fail	—	1.3 Fail	2.0 Fail	1.5 Fail
1.6 Fail	1.3 Fail	—	1.5 Fail	1.1 Fail
2.4 Fail	2.0 Fail	1.5 Fail	—	1.4 Fail
1.8 Fail	1.5 Fail	1.1 Fail	1.4 Fail	—

White BG

1.3Fail

1.5Fail

2.1Fail

3.1AA Large

2.3Fail

Black BG

16.7AAA

13.6AAA

10.2AAA

6.8AA

9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F0F0CD

E2E1B7

CDCDAA

9B9B94

9A9BB0

Deuteranopia

F1F3CE

E5E9B8

D3D9A9

9C9E94

9894B1

Tritanopia

FAD2D3

F5BABB

F0A6A6

A59292

88B2B2

Achromatopsia

E6E6E6

D2D2D2

B8B8B8

959595

A6A6A6

Shades & Tints Shades & Tints

#FBE1C6

Dark

Light

#F8C5B2

Dark

Light

#F49BAF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbe1c6;
  --color-2: #f8c5b2;
  --color-3: #f49baf;
  --color-4: #a68c97;
  --color-5: #86b5af;
}

SCSS

$color-1: #fbe1c6;
$color-2: #f8c5b2;
$color-3: #f49baf;
$color-4: #a68c97;
$color-5: #86b5af;

TAILWIND

colors: {
  'brand-1': '#fbe1c6',
  'brand-2': '#f8c5b2',
  'brand-3': '#f49baf',
  'brand-4': '#a68c97',
  'brand-5': '#86b5af',
}

RGB Array

[251, 225, 198], [248, 197, 178], [244, 155, 175], [166, 140, 151], [134, 181, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FBE1C6, #F8C5B2, #F49BAF, #A68C97, #86B5AF 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: #fbe1c6; --color-2: #f8c5b2; --color-3: #f49baf; --color-4: #a68c97; --color-5: #86b5af. 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