#B6A4AF + #FBCFC4 + #F3EED0 + #CBE9AF + #8BD6C2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B6A4AF

Mauve · DarkGray · Rose Pink

HEX

#B6A4AF

RGB

rgb(182, 164, 175)

HSL

hsl(323, 11%, 68%)

HSB

hsb(323, 10%, 71%)

CMYK

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

Oklch

oklch(73.8% 0.026 340.5)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#FBCFC4

Peach Pink · Pink · Cherry Blossom

HEX

#FBCFC4

RGB

rgb(251, 207, 196)

HSL

hsl(12, 87%, 88%)

HSB

hsb(12, 22%, 98%)

CMYK

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

Oklch

oklch(88.9% 0.052 34.4)

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

#F3EED0

Fresh Green · Beige · Lemon Cream

HEX

#F3EED0

RGB

rgb(243, 238, 208)

HSL

hsl(51, 59%, 88%)

HSB

hsb(51, 14%, 95%)

CMYK

cmyk(0%, 2%, 14%, 5%)

Oklch

oklch(94.5% 0.040 99.3)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#CBE9AF

Emerald · LightGray · Apple Green

HEX

#CBE9AF

RGB

rgb(203, 233, 175)

HSL

hsl(91, 57%, 80%)

HSB

hsb(91, 25%, 91%)

CMYK

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

Oklch

oklch(89.8% 0.083 130.2)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

#8BD6C2

Jade · SkyBlue · Lake Green

HEX

#8BD6C2

RGB

rgb(139, 214, 194)

HSL

hsl(164, 48%, 69%)

HSB

hsb(164, 35%, 84%)

CMYK

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

Oklch

oklch(82.1% 0.080 175.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B6A4AF

A4B6AB

Analogous

B4A4B6

B6A4AF

B6A4A7

Triadic

B6A4AF

AFB6A4

A4AFB6

Split-Comp.

B6A4AF

A7B6A4

A4B6B4

Tetradic

B6A4AF

B6B4A4

A4B6AB

A4A7B6

Contrast Matrix WCAG 2.1 Contrast

B6A4AF	FBCFC4	F3EED0	CBE9AF	8BD6C2
—	1.7 Fail	2.0 Fail	1.8 Fail	1.4 Fail
1.7 Fail	—	1.2 Fail	1.1 Fail	1.2 Fail
2.0 Fail	1.2 Fail	—	1.1 Fail	1.4 Fail
1.8 Fail	1.1 Fail	1.1 Fail	—	1.3 Fail
1.4 Fail	1.2 Fail	1.4 Fail	1.3 Fail	—

White BG

2.4Fail

1.4Fail

1.2Fail

1.3Fail

1.7Fail

Black BG

8.9AAA

14.8AAA

18.0AAA

15.8AAA

12.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AEAEAC

E8E8C7

F1F1D7

D8D8BD

ABACC7

Deuteranopia

AFB1AC

EBEEC7

F1F2D9

D6D4C0

A7A2C8

Tritanopia

B5AAAA

F9C9C9

F3DDDE

CDC8CB

8FCBCC

Achromatopsia

ABABAB

DBDBDB

ECECEC

D9D9D9

BDBDBD

Shades & Tints Shades & Tints

#B6A4AF

Dark

Light

#FBCFC4

Dark

Light

#F3EED0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b6a4af;
  --color-2: #fbcfc4;
  --color-3: #f3eed0;
  --color-4: #cbe9af;
  --color-5: #8bd6c2;
}

SCSS

$color-1: #b6a4af;
$color-2: #fbcfc4;
$color-3: #f3eed0;
$color-4: #cbe9af;
$color-5: #8bd6c2;

TAILWIND

colors: {
  'brand-1': '#b6a4af',
  'brand-2': '#fbcfc4',
  'brand-3': '#f3eed0',
  'brand-4': '#cbe9af',
  'brand-5': '#8bd6c2',
}

RGB Array

[182, 164, 175], [251, 207, 196], [243, 238, 208], [203, 233, 175], [139, 214, 194]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B6A4AF, #FBCFC4, #F3EED0, #CBE9AF, #8BD6C2 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: #b6a4af; --color-2: #fbcfc4; --color-3: #f3eed0; --color-4: #cbe9af; --color-5: #8bd6c2. 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