← Back to Editor

#A4B1B1 · #BFBFB4 · #D9CCB6 · #B6A796 · #816E66

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A4B1B1

Sky Blue · DarkGray · Silver Sand

HEX
#A4B1B1
RGB
rgb(164, 177, 177)
HSL
hsl(180, 8%, 67%)
HSB
hsb(180, 7%, 69%)
CMYK
cmyk(7%, 0%, 0%, 31%)
Oklch
oklch(75.0% 0.015 196.8)

TraditionalSky Blue」· PaintSilver Sand」· Creative Urban Concrete

#BFBFB4

Fresh Green · Silver · Pearl Gray

HEX
#BFBFB4
RGB
rgb(191, 191, 180)
HSL
hsl(60, 8%, 73%)
HSB
hsb(60, 6%, 75%)
CMYK
cmyk(0%, 0%, 6%, 25%)
Oklch
oklch(80.2% 0.015 106.7)

TraditionalFresh Green」· PaintPearl Gray」· Creative Silver Lining

#D9CCB6

Goose Yellow · Silver · Peach Orange

HEX
#D9CCB6
RGB
rgb(217, 204, 182)
HSL
hsl(38, 32%, 78%)
HSB
hsb(38, 16%, 85%)
CMYK
cmyk(0%, 6%, 16%, 15%)
Oklch
oklch(85.0% 0.033 81.0)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#B6A796

Ginger · DarkGray · Warm Sun

HEX
#B6A796
RGB
rgb(182, 167, 150)
HSL
hsl(32, 18%, 65%)
HSB
hsb(32, 18%, 71%)
CMYK
cmyk(0%, 8%, 18%, 29%)
Oklch
oklch(73.6% 0.030 70.8)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#816E66

Tangerine · DimGray · Amber Brown

HEX
#816E66
RGB
rgb(129, 110, 102)
HSL
hsl(18, 12%, 45%)
HSB
hsb(18, 21%, 51%)
CMYK
cmyk(0%, 15%, 21%, 49%)
Oklch
oklch(55.4% 0.027 44.2)

TraditionalTangerine」· PaintAmber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A4B1B1
B2A4A4

Analogous

A4B2AB
A4B1B1
A4ABB2

Triadic

A4B1B1
B2A4B2
B2B2A4

Split-Comp.

A4B1B1
B2A4AB
B2ABA4

Tetradic

A4B1B1
ABA4B2
B2A4A4
ABB2A4

Contrast Matrix WCAG 2.1 Contrast

A4B1B1
BFBFB4
D9CCB6
B6A796
816E66
1.2
Fail
1.4
Fail
1.1
Fail
2.2
Fail
1.2
Fail
1.2
Fail
1.3
Fail
2.6
Fail
1.4
Fail
1.2
Fail
1.5
Fail
3.0
AA Large
1.1
Fail
1.3
Fail
1.5
Fail
2.1
Fail
2.2
Fail
2.6
Fail
3.0
AA Large
2.1
Fail
White BG
2.2Fail
1.9Fail
1.6Fail
2.3Fail
4.8AA
Black BG
9.5AAA
11.3AAA
13.3AAA
9.0AAA
4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAAAB1
BFBFB7
D3D3BB
B0AF9A
797968

Deuteranopia

A9A8B1
BFBFB7
D4D5BD
B0B29B
7A7B68

Tritanopia

A5B1B1
BFB9B9
D8C0C0
B59D9E
80696A

Achromatopsia

ADADAD
BEBEBE
CDCDCD
AAAAAA
737373

Shades & Tints Shades & Tints

#A4B1B1

Dark
Light

#BFBFB4

Dark
Light

#D9CCB6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a4b1b1;
  --color-2: #bfbfb4;
  --color-3: #d9ccb6;
  --color-4: #b6a796;
  --color-5: #816e66;
}

SCSS

$color-1: #a4b1b1;
$color-2: #bfbfb4;
$color-3: #d9ccb6;
$color-4: #b6a796;
$color-5: #816e66;

TAILWIND

colors: {
  'brand-1': '#a4b1b1',
  'brand-2': '#bfbfb4',
  'brand-3': '#d9ccb6',
  'brand-4': '#b6a796',
  'brand-5': '#816e66',
}

RGB Array

[164, 177, 177], [191, 191, 180], [217, 204, 182], [182, 167, 150], [129, 110, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A4B1B1, #BFBFB4, #D9CCB6, #B6A796, #816E66 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. 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: #a4b1b1; --color-2: #bfbfb4; --color-3: #d9ccb6; --color-4: #b6a796; --color-5: #816e66. 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 beauty, lifestyle, arts 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