#BAB097 + #C0BCAA + #DBCDB4 + #EBD9BD + #E6E3C3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BAB097

Ginger · DarkGray · Sunflower

HEX

#BAB097

RGB

rgb(186, 176, 151)

HSL

hsl(43, 20%, 66%)

HSB

hsb(43, 19%, 73%)

CMYK

cmyk(0%, 5%, 19%, 27%)

Oklch

oklch(75.9% 0.036 88.8)

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

#C0BCAA

Goose Yellow · Silver · Sunflower

HEX

#C0BCAA

RGB

rgb(192, 188, 170)

HSL

hsl(49, 15%, 71%)

HSB

hsb(49, 11%, 75%)

CMYK

cmyk(0%, 2%, 11%, 25%)

Oklch

oklch(79.3% 0.025 96.6)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#DBCDB4

Goose Yellow · Wheat · Peach Orange

HEX

#DBCDB4

RGB

rgb(219, 205, 180)

HSL

hsl(38, 35%, 78%)

HSB

hsb(38, 18%, 86%)

CMYK

cmyk(0%, 6%, 18%, 14%)

Oklch

oklch(85.3% 0.037 82.2)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#EBD9BD

Goose Yellow · Wheat · Peach Orange

HEX

#EBD9BD

RGB

rgb(235, 217, 189)

HSL

hsl(37, 53%, 83%)

HSB

hsb(37, 20%, 92%)

CMYK

cmyk(0%, 8%, 20%, 8%)

Oklch

oklch(89.3% 0.042 78.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#E6E3C3

Fresh Green · Wheat · Lemon Cream

HEX

#E6E3C3

RGB

rgb(230, 227, 195)

HSL

hsl(55, 41%, 83%)

HSB

hsb(55, 15%, 90%)

CMYK

cmyk(0%, 1%, 15%, 10%)

Oklch

oklch(91.0% 0.042 102.8)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BAB097

97A1BA

Analogous

BA9E97

BAB097

B2BA97

Triadic

BAB097

97BAB0

B097BA

Split-Comp.

BAB097

97B2BA

9E97BA

Tetradic

BAB097

97BA9E

97A1BA

BA97B2

Contrast Matrix WCAG 2.1 Contrast

BAB097	C0BCAA	DBCDB4	EBD9BD	E6E3C3
—	1.1 Fail	1.4 Fail	1.6 Fail	1.7 Fail
1.1 Fail	—	1.2 Fail	1.4 Fail	1.5 Fail
1.4 Fail	1.2 Fail	—	1.1 Fail	1.2 Fail
1.6 Fail	1.4 Fail	1.1 Fail	—	1.1 Fail
1.7 Fail	1.5 Fail	1.2 Fail	1.1 Fail	—

White BG

2.2Fail

1.9Fail

1.6Fail

1.4Fail

1.3Fail

Black BG

9.7AAA

11.0AAA

13.4AAA

15.2AAA

16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B69D

BEBEAE

D5D5BA

E3E3C4

E5E5CB

Deuteranopia

B6B79F

BFBFAF

D6D7BC

E4E6C5

E5E5CD

Tritanopia

BAA2A3

C0B2B3

DABFC0

EAC9CA

E6D1D2

Achromatopsia

B0B0B0

BBBBBB

CECECE

DBDBDB

E0E0E0

Shades & Tints Shades & Tints

#BAB097

Dark

Light

#C0BCAA

Dark

Light

#DBCDB4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bab097;
  --color-2: #c0bcaa;
  --color-3: #dbcdb4;
  --color-4: #ebd9bd;
  --color-5: #e6e3c3;
}

SCSS

$color-1: #bab097;
$color-2: #c0bcaa;
$color-3: #dbcdb4;
$color-4: #ebd9bd;
$color-5: #e6e3c3;

TAILWIND

colors: {
  'brand-1': '#bab097',
  'brand-2': '#c0bcaa',
  'brand-3': '#dbcdb4',
  'brand-4': '#ebd9bd',
  'brand-5': '#e6e3c3',
}

RGB Array

[186, 176, 151], [192, 188, 170], [219, 205, 180], [235, 217, 189], [230, 227, 195]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BAB097, #C0BCAA, #DBCDB4, #EBD9BD, #E6E3C3 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: #bab097; --color-2: #c0bcaa; --color-3: #dbcdb4; --color-4: #ebd9bd; --color-5: #e6e3c3. 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