#BBB666 + #C89A78 + #EBBEC7 + #C9BBC4 + #6F6FA1 · muted - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BBB666

Autumn Sage · Tan · Sunflower

HEX

#BBB666

RGB

rgb(187, 182, 102)

HSL

hsl(56, 38%, 57%)

HSB

hsb(56, 45%, 73%)

CMYK

cmyk(0%, 3%, 45%, 27%)

Oklch

oklch(76.3% 0.102 105.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#C89A78

Apricot · DarkSalmon · Warm Sun

HEX

#C89A78

RGB

rgb(200, 154, 120)

HSL

hsl(25, 42%, 63%)

HSB

hsb(25, 40%, 78%)

CMYK

cmyk(0%, 23%, 40%, 22%)

Oklch

oklch(72.1% 0.072 57.8)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#EBBEC7

Peach Pink · Pink · Cherry Blossom

HEX

#EBBEC7

RGB

rgb(235, 190, 199)

HSL

hsl(348, 53%, 83%)

HSB

hsb(348, 19%, 92%)

CMYK

cmyk(0%, 19%, 15%, 8%)

Oklch

oklch(84.4% 0.053 4.8)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#C9BBC4

Mauve · Silver · Cherry Blossom

HEX

#C9BBC4

RGB

rgb(201, 187, 196)

HSL

hsl(321, 11%, 76%)

HSB

hsb(321, 7%, 79%)

CMYK

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

Oklch

oklch(80.6% 0.020 338.8)

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

#6F6FA1

Deep Indigo · SlateGray · Navy Blue

HEX

#6F6FA1

RGB

rgb(111, 111, 161)

HSL

hsl(240, 21%, 53%)

HSB

hsb(240, 31%, 63%)

CMYK

cmyk(31%, 31%, 0%, 37%)

Oklch

oklch(56.2% 0.077 283.6)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BBB666

686DBB

Analogous

BB8C68

BBB666

97BB68

Triadic

BBB666

68BBB5

B568BB

Split-Comp.

BBB666

6897BB

8C68BB

Tetradic

BBB666

68BB8C

686DBB

BB6897

Contrast Matrix WCAG 2.1 Contrast

BBB666	C89A78	EBBEC7	C9BBC4	6F6FA1
—	1.2 Fail	1.3 Fail	1.1 Fail	2.2 Fail
1.2 Fail	—	1.5 Fail	1.4 Fail	1.9 Fail
1.3 Fail	1.5 Fail	—	1.1 Fail	2.8 Fail
1.1 Fail	1.4 Fail	1.1 Fail	—	2.6 Fail
2.2 Fail	1.9 Fail	2.8 Fail	2.6 Fail	—

White BG

2.1Fail

2.5Fail

1.7Fail

1.8Fail

4.7AA

Black BG

10.0AAA

8.3AAA

12.7AAA

11.4AAA

4.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B979

B4B480

D8D7C5

C3C3C2

6F6F95

Deuteranopia

B9BA7E

B7BA82

DADEC4

C4C5C1

6F6F92

Tritanopia

BB898C

C68788

E9C3C3

C8C0C0

6F8B89

Achromatopsia

AEAEAE

A4A4A4

CCCCCC

C0C0C0

757575

Shades & Tints Shades & Tints

#BBB666

Dark

Light

#C89A78

Dark

Light

#EBBEC7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bbb666;
  --color-2: #c89a78;
  --color-3: #ebbec7;
  --color-4: #c9bbc4;
  --color-5: #6f6fa1;
}

SCSS

$color-1: #bbb666;
$color-2: #c89a78;
$color-3: #ebbec7;
$color-4: #c9bbc4;
$color-5: #6f6fa1;

TAILWIND

colors: {
  'brand-1': '#bbb666',
  'brand-2': '#c89a78',
  'brand-3': '#ebbec7',
  'brand-4': '#c9bbc4',
  'brand-5': '#6f6fa1',
}

RGB Array

[187, 182, 102], [200, 154, 120], [235, 190, 199], [201, 187, 196], [111, 111, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This muted-style palette of #BBB666, #C89A78, #EBBEC7, #C9BBC4, #6F6FA1 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: #bbb666; --color-2: #c89a78; --color-3: #ebbec7; --color-4: #c9bbc4; --color-5: #6f6fa1. 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 muted-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