← Back to Editor

#B3A89D · #BFAB9B · #C1B0A8 · #97D0C6 · #E2C0BC

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

#B3A89D

Ginger · DarkGray · Warm Sun

HEX
#B3A89D
RGB
rgb(179, 168, 157)
HSL
hsl(30, 13%, 66%)
HSB
hsb(30, 12%, 70%)
CMYK
cmyk(0%, 6%, 12%, 30%)
Oklch
oklch(73.8% 0.020 67.5)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#BFAB9B

Apricot · Tan · Warm Sun

HEX
#BFAB9B
RGB
rgb(191, 171, 155)
HSL
hsl(27, 22%, 68%)
HSB
hsb(27, 19%, 75%)
CMYK
cmyk(0%, 10%, 19%, 25%)
Oklch
oklch(75.4% 0.032 61.0)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#C1B0A8

Apricot · DarkGray · Warm Sun

HEX
#C1B0A8
RGB
rgb(193, 176, 168)
HSL
hsl(19, 17%, 71%)
HSB
hsb(19, 13%, 76%)
CMYK
cmyk(0%, 9%, 13%, 24%)
Oklch
oklch(76.9% 0.023 46.9)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#97D0C6

Jade · LightSteelBlue · Lake Green

HEX
#97D0C6
RGB
rgb(151, 208, 198)
HSL
hsl(169, 38%, 70%)
HSB
hsb(169, 27%, 82%)
CMYK
cmyk(27%, 0%, 5%, 18%)
Oklch
oklch(81.6% 0.060 182.7)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#E2C0BC

Peach Pink · LightPink · Cherry Blossom

HEX
#E2C0BC
RGB
rgb(226, 192, 188)
HSL
hsl(6, 40%, 81%)
HSB
hsb(6, 17%, 89%)
CMYK
cmyk(0%, 15%, 17%, 11%)
Oklch
oklch(83.6% 0.039 25.9)

TraditionalPeach Pink」· PaintCherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3A89D
9DA8B4

Analogous

B49D9D
B3A89D
B4B49D

Triadic

B3A89D
9DB4A8
A89DB4

Split-Comp.

B3A89D
9DB4B4
9D9DB4

Tetradic

B3A89D
9DB49D
9DA8B4
B49DB4

Contrast Matrix WCAG 2.1 Contrast

B3A89D
BFAB9B
C1B0A8
97D0C6
E2C0BC
1.1
Fail
1.1
Fail
1.3
Fail
1.4
Fail
1.1
Fail
1.1
Fail
1.3
Fail
1.3
Fail
1.1
Fail
1.1
Fail
1.2
Fail
1.2
Fail
1.3
Fail
1.3
Fail
1.2
Fail
1.0
Fail
1.4
Fail
1.3
Fail
1.2
Fail
1.0
Fail
White BG
2.3Fail
2.2Fail
2.1Fail
1.7Fail
1.7Fail
Black BG
9.0AAA
9.5AAA
10.0AAA
12.2AAA
12.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AEAEA0
B6B69F
BAB9AA
B0B0C8
D3D3BD

Deuteranopia

AFB0A0
B8B9A0
BBBCAA
ACA8C9
D5D8BD

Tritanopia

B2A2A2
BEA2A3
C0ABAC
9ACACB
E0BEBE

Achromatopsia

AAAAAA
AFAFAF
B4B4B4
BEBEBE
CACACA

Shades & Tints Shades & Tints

#B3A89D

Dark
Light

#BFAB9B

Dark
Light

#C1B0A8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3a89d;
  --color-2: #bfab9b;
  --color-3: #c1b0a8;
  --color-4: #97d0c6;
  --color-5: #e2c0bc;
}

SCSS

$color-1: #b3a89d;
$color-2: #bfab9b;
$color-3: #c1b0a8;
$color-4: #97d0c6;
$color-5: #e2c0bc;

TAILWIND

colors: {
  'brand-1': '#b3a89d',
  'brand-2': '#bfab9b',
  'brand-3': '#c1b0a8',
  'brand-4': '#97d0c6',
  'brand-5': '#e2c0bc',
}

RGB Array

[179, 168, 157], [191, 171, 155], [193, 176, 168], [151, 208, 198], [226, 192, 188]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B3A89D, #BFAB9B, #C1B0A8, #97D0C6, #E2C0BC 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: #b3a89d; --color-2: #bfab9b; --color-3: #c1b0a8; --color-4: #97d0c6; --color-5: #e2c0bc. 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