← Back to Editor

#B5A591 · #AAB8A5 · #A0CBBA · #BCD2C8 · #D8D7D6

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

#B5A591

Ginger · DarkGray · Warm Sun

HEX
#B5A591
RGB
rgb(181, 165, 145)
HSL
hsl(33, 20%, 64%)
HSB
hsb(33, 20%, 71%)
CMYK
cmyk(0%, 9%, 20%, 29%)
Oklch
oklch(73.0% 0.034 73.4)

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

#AAB8A5

Celadon · DarkGray · Apple Green

HEX
#AAB8A5
RGB
rgb(170, 184, 165)
HSL
hsl(104, 12%, 68%)
HSB
hsb(104, 10%, 72%)
CMYK
cmyk(8%, 0%, 10%, 28%)
Oklch
oklch(76.6% 0.031 137.4)

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

#A0CBBA

Jade · Silver · Apple Green

HEX
#A0CBBA
RGB
rgb(160, 203, 186)
HSL
hsl(156, 29%, 71%)
HSB
hsb(156, 21%, 80%)
CMYK
cmyk(21%, 0%, 8%, 20%)
Oklch
oklch(80.6% 0.051 168.9)

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

#BCD2C8

Jade · Silver · Apple Green

HEX
#BCD2C8
RGB
rgb(188, 210, 200)
HSL
hsl(153, 20%, 78%)
HSB
hsb(153, 10%, 82%)
CMYK
cmyk(10%, 0%, 5%, 18%)
Oklch
oklch(84.4% 0.027 166.6)

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

#D8D7D6

Silver Gray · LightGray · Pearl Gray

HEX
#D8D7D6
RGB
rgb(216, 215, 214)
HSL
hsl(30, 2%, 84%)
HSB
hsb(30, 1%, 85%)
CMYK
cmyk(0%, 0%, 1%, 15%)
Oklch
oklch(88.0% 0.002 67.8)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B5A591
91A1B6

Analogous

B69391
B5A591
B4B691

Triadic

B5A591
91B6A5
A591B6

Split-Comp.

B5A591
91B4B6
9391B6

Tetradic

B5A591
91B693
91A1B6
B691B4

Contrast Matrix WCAG 2.1 Contrast

B5A591
AAB8A5
A0CBBA
BCD2C8
D8D7D6
—
1.2
Fail
1.3
Fail
1.5
Fail
1.7
Fail
1.2
Fail
—
1.2
Fail
1.3
Fail
1.4
Fail
1.3
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
1.5
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.7
Fail
1.4
Fail
1.2
Fail
1.1
Fail
—
White BG
2.4Fail
2.1Fail
1.8Fail
1.6Fail
1.4Fail
Black BG
8.8AAA
10.1AAA
11.7AAA
13.2AAA
14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AEAE96
B0B0AA
B3B3BE
C6C6CA
D8D8D6

Deuteranopia

AFB097
AFAEAB
B0ADBF
C4C3CB
D8D8D6

Tritanopia

B49A9B
ABADAE
A2C1C2
BDCCCD
D8D6D6

Achromatopsia

A8A8A8
B2B2B2
BCBCBC
CACACA
D7D7D7

Shades & Tints Shades & Tints

#B5A591

Dark
Light

#AAB8A5

Dark
Light

#A0CBBA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b5a591;
  --color-2: #aab8a5;
  --color-3: #a0cbba;
  --color-4: #bcd2c8;
  --color-5: #d8d7d6;
}

SCSS

$color-1: #b5a591;
$color-2: #aab8a5;
$color-3: #a0cbba;
$color-4: #bcd2c8;
$color-5: #d8d7d6;

TAILWIND

colors: {
  'brand-1': '#b5a591',
  'brand-2': '#aab8a5',
  'brand-3': '#a0cbba',
  'brand-4': '#bcd2c8',
  'brand-5': '#d8d7d6',
}

RGB Array

[181, 165, 145], [170, 184, 165], [160, 203, 186], [188, 210, 200], [216, 215, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B5A591, #AAB8A5, #A0CBBA, #BCD2C8, #D8D7D6 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: #b5a591; --color-2: #aab8a5; --color-3: #a0cbba; --color-4: #bcd2c8; --color-5: #d8d7d6. 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