← Back to Editor

#BFB49E · #BECDA6 · #6F888C · #61456D · #32163F

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#BFB49E

Ginger · Tan · Sunflower

HEX
#BFB49E
RGB
rgb(191, 180, 158)
HSL
hsl(40, 20%, 68%)
HSB
hsb(40, 17%, 75%)
CMYK
cmyk(0%, 6%, 17%, 25%)
Oklch
oklch(77.3% 0.033 84.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#BECDA6

Willow Green · Silver · Apple Green

HEX
#BECDA6
RGB
rgb(190, 205, 166)
HSL
hsl(83, 28%, 73%)
HSB
hsb(83, 19%, 80%)
CMYK
cmyk(7%, 0%, 19%, 20%)
Oklch
oklch(82.7% 0.055 124.7)

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

#6F888C

Slate Blue · SlateGray · Mint Ice

HEX
#6F888C
RGB
rgb(111, 136, 140)
HSL
hsl(188, 12%, 49%)
HSB
hsb(188, 21%, 55%)
CMYK
cmyk(21%, 3%, 0%, 45%)
Oklch
oklch(60.9% 0.029 208.3)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#61456D

Dark Plum · DimGray · Eggplant

HEX
#61456D
RGB
rgb(97, 69, 109)
HSL
hsl(282, 22%, 35%)
HSB
hsb(282, 37%, 43%)
CMYK
cmyk(11%, 37%, 0%, 57%)
Oklch
oklch(43.7% 0.072 315.4)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#32163F

Dark Plum · MidnightBlue · Dark Purple

HEX
#32163F
RGB
rgb(50, 22, 63)
HSL
hsl(281, 48%, 17%)
HSB
hsb(281, 65%, 25%)
CMYK
cmyk(21%, 65%, 0%, 75%)
Oklch
oklch(26.2% 0.080 313.8)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFB49E
9DA8BE

Analogous

BEA39D
BFB49E
B8BE9D

Triadic

BFB49E
9DBEB3
B39DBE

Split-Comp.

BFB49E
9DB8BE
A39DBE

Tetradic

BFB49E
9DBEA3
9DA8BE
BE9DB8

Contrast Matrix WCAG 2.1 Contrast

BFB49E
BECDA6
6F888C
61456D
32163F
—
1.2
Fail
1.8
Fail
4.0
AA Large
7.7
AAA
1.2
Fail
—
2.2
Fail
4.8
AA
9.4
AAA
1.8
Fail
2.2
Fail
—
2.2
Fail
4.2
AA Large
4.0
AA Large
4.8
AA
2.2
Fail
—
2.0
Fail
7.7
AAA
9.4
AAA
4.2
AA Large
2.0
Fail
—
White BG
2.1Fail
1.7Fail
3.8AA Large
8.1AAA
15.9AAA
Black BG
10.2AAA
12.5AAA
5.6AA
2.6Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BABAA3
C4C5AF
7A7A8B
555563
262635

Deuteranopia

BBBCA5
C4C3B2
78768B
575961
282A33

Tritanopia

BEA8A8
BFB7B9
708A8A
605C5A
312D2C

Achromatopsia

B5B5B5
C4C4C4
818181
525252
232323

Shades & Tints Shades & Tints

#BFB49E

Dark
Light

#BECDA6

Dark
Light

#6F888C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bfb49e;
  --color-2: #becda6;
  --color-3: #6f888c;
  --color-4: #61456d;
  --color-5: #32163f;
}

SCSS

$color-1: #bfb49e;
$color-2: #becda6;
$color-3: #6f888c;
$color-4: #61456d;
$color-5: #32163f;

TAILWIND

colors: {
  'brand-1': '#bfb49e',
  'brand-2': '#becda6',
  'brand-3': '#6f888c',
  'brand-4': '#61456d',
  'brand-5': '#32163f',
}

RGB Array

[191, 180, 158], [190, 205, 166], [111, 136, 140], [97, 69, 109], [50, 22, 63]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BFB49E, #BECDA6, #6F888C, #61456D, #32163F is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #bfb49e; --color-2: #becda6; --color-3: #6f888c; --color-4: #61456d; --color-5: #32163f. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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. Restrained colors convey professionalism and trust. 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