#B3A8BF + #A6AB7A + #E3B17C + #E9A3BB + #D379D2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B3A8BF

Wisteria · DarkGray · Lilac Purple

HEX

#B3A8BF

RGB

rgb(179, 168, 191)

HSL

hsl(269, 15%, 70%)

HSB

hsb(269, 12%, 75%)

CMYK

cmyk(6%, 12%, 0%, 25%)

Oklch

oklch(74.8% 0.035 307.0)

Traditional「Wisteria」· Paint「Lilac Purple」· Creative Lavender Dream

#A6AB7A

Autumn Sage · DarkSeaGreen · Sunflower

HEX

#A6AB7A

RGB

rgb(166, 171, 122)

HSL

hsl(66, 23%, 57%)

HSB

hsb(66, 29%, 67%)

CMYK

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

Oklch

oklch(72.5% 0.067 112.8)

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

#E3B17C

Ginger · BurlyWood · Warm Sun

HEX

#E3B17C

RGB

rgb(227, 177, 124)

HSL

hsl(31, 65%, 69%)

HSB

hsb(31, 45%, 89%)

CMYK

cmyk(0%, 22%, 45%, 11%)

Oklch

oklch(79.4% 0.090 67.6)

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

#E9A3BB

Rouge · LightPink · Cherry Blossom

HEX

#E9A3BB

RGB

rgb(233, 163, 187)

HSL

hsl(339, 61%, 78%)

HSB

hsb(339, 30%, 91%)

CMYK

cmyk(0%, 30%, 20%, 9%)

Oklch

oklch(78.9% 0.088 357.0)

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

#D379D2

Mauve · Orchid · Lilac Purple

HEX

#D379D2

RGB

rgb(211, 121, 210)

HSL

hsl(301, 51%, 65%)

HSB

hsb(301, 43%, 83%)

CMYK

cmyk(0%, 43%, 0%, 17%)

Oklch

oklch(70.5% 0.158 327.5)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3A8BF

B3BEA7

Analogous

A7A7BE

B3A8BF

BEA7BE

Triadic

B3A8BF

BEB2A7

A7BEB2

Split-Comp.

B3A8BF

BEBEA7

A7BEA7

Tetradic

B3A8BF

BEA7A7

B3BEA7

A7BEBE

Contrast Matrix WCAG 2.1 Contrast

B3A8BF	A6AB7A	E3B17C	E9A3BB	D379D2
—	1.1 Fail	1.2 Fail	1.1 Fail	1.2 Fail
1.1 Fail	—	1.2 Fail	1.2 Fail	1.2 Fail
1.2 Fail	1.2 Fail	—	1.0 Fail	1.5 Fail
1.1 Fail	1.2 Fail	1.0 Fail	—	1.4 Fail
1.2 Fail	1.2 Fail	1.5 Fail	1.4 Fail	—

White BG

2.3Fail

2.4Fail

1.9Fail

2.0Fail

2.8Fail

Black BG

9.3AAA

8.7AAA

10.8AAA

10.4AAA

7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AEAEB9

A8A886

CDCD89

CBCAB5

ACABBC

Deuteranopia

AFB0B8

A8A889

D0D48C

CFD4B4

B1B8B7

Tritanopia

B2B5B4

A68F91

E09395

E6B1B0

CFABA8

Achromatopsia

AEAEAE

A4A4A4

BABABA

BBBBBB

9E9E9E

Shades & Tints Shades & Tints

#B3A8BF

Dark

Light

#A6AB7A

Dark

Light

#E3B17C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3a8bf;
  --color-2: #a6ab7a;
  --color-3: #e3b17c;
  --color-4: #e9a3bb;
  --color-5: #d379d2;
}

SCSS

$color-1: #b3a8bf;
$color-2: #a6ab7a;
$color-3: #e3b17c;
$color-4: #e9a3bb;
$color-5: #d379d2;

TAILWIND

colors: {
  'brand-1': '#b3a8bf',
  'brand-2': '#a6ab7a',
  'brand-3': '#e3b17c',
  'brand-4': '#e9a3bb',
  'brand-5': '#d379d2',
}

RGB Array

[179, 168, 191], [166, 171, 122], [227, 177, 124], [233, 163, 187], [211, 121, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B3A8BF, #A6AB7A, #E3B17C, #E9A3BB, #D379D2 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: #b3a8bf; --color-2: #a6ab7a; --color-3: #e3b17c; --color-4: #e9a3bb; --color-5: #d379d2. 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