#BD9F97 + #D6C5C5 + #DBD0DA + #E2DDF0 + #EBEBFF · earth - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BD9F97

Peach Pink · DarkGray · Coral Red

HEX

#BD9F97

RGB

rgb(189, 159, 151)

HSL

hsl(13, 22%, 67%)

HSB

hsb(13, 20%, 74%)

CMYK

cmyk(0%, 16%, 20%, 26%)

Oklch

oklch(72.7% 0.038 35.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#D6C5C5

Peach Pink · LightGray · Cherry Blossom

HEX

#D6C5C5

RGB

rgb(214, 197, 197)

HSL

hsl(0, 17%, 81%)

HSB

hsb(0, 8%, 84%)

CMYK

cmyk(0%, 8%, 8%, 16%)

Oklch

oklch(83.7% 0.019 17.5)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#DBD0DA

Mauve · LightGray · Lavender

HEX

#DBD0DA

RGB

rgb(219, 208, 218)

HSL

hsl(305, 13%, 84%)

HSB

hsb(305, 5%, 86%)

CMYK

cmyk(0%, 5%, 0%, 14%)

Oklch

oklch(86.9% 0.018 328.5)

Traditional「Mauve」· Paint「Lavender」· Creative Rose Petal

#E2DDF0

Wisteria · Lavender · Sky Blue

HEX

#E2DDF0

RGB

rgb(226, 221, 240)

HSL

hsl(256, 39%, 90%)

HSB

hsb(256, 8%, 94%)

CMYK

cmyk(6%, 8%, 0%, 6%)

Oklch

oklch(90.7% 0.026 297.9)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

#EBEBFF

Wisteria · Lavender · Sky Blue

HEX

#EBEBFF

RGB

rgb(235, 235, 255)

HSL

hsl(240, 100%, 96%)

HSB

hsb(240, 8%, 100%)

CMYK

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

Oklch

oklch(94.6% 0.027 285.9)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BD9F97

98B5BD

Analogous

BD98A3

BD9F97

BDB398

Triadic

BD9F97

98BDA0

A098BD

Split-Comp.

BD9F97

98BDB3

98A3BD

Tetradic

BD9F97

A3BD98

98B5BD

B398BD

Contrast Matrix WCAG 2.1 Contrast

BD9F97	D6C5C5	DBD0DA	E2DDF0	EBEBFF
—	1.5 Fail	1.6 Fail	1.8 Fail	2.1 Fail
1.5 Fail	—	1.1 Fail	1.3 Fail	1.4 Fail
1.6 Fail	1.1 Fail	—	1.1 Fail	1.3 Fail
1.8 Fail	1.3 Fail	1.1 Fail	—	1.1 Fail
2.1 Fail	1.4 Fail	1.3 Fail	1.1 Fail	—

White BG

2.5Fail

1.7Fail

1.5Fail

1.3Fail

1.2Fail

Black BG

8.6AAA

12.7AAA

14.0AAA

15.8AAA

17.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B0B099

CFCEC5

D6D6D8

E0E0EB

EBEBFA

Deuteranopia

B2B499

D0D1C5

D7D8D7

E0E1EA

EBEBF9

Tritanopia

BB9A9B

D5C5C5

DAD6D5

E2E8E7

EBF6F6

Achromatopsia

A7A7A7

CACACA

D4D4D4

E1E1E1

EDEDED

Shades & Tints Shades & Tints

#BD9F97

Dark

Light

#D6C5C5

Dark

Light

#DBD0DA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bd9f97;
  --color-2: #d6c5c5;
  --color-3: #dbd0da;
  --color-4: #e2ddf0;
  --color-5: #ebebff;
}

SCSS

$color-1: #bd9f97;
$color-2: #d6c5c5;
$color-3: #dbd0da;
$color-4: #e2ddf0;
$color-5: #ebebff;

TAILWIND

colors: {
  'brand-1': '#bd9f97',
  'brand-2': '#d6c5c5',
  'brand-3': '#dbd0da',
  'brand-4': '#e2ddf0',
  'brand-5': '#ebebff',
}

RGB Array

[189, 159, 151], [214, 197, 197], [219, 208, 218], [226, 221, 240], [235, 235, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #BD9F97, #D6C5C5, #DBD0DA, #E2DDF0, #EBEBFF 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: #bd9f97; --color-2: #d6c5c5; --color-3: #dbd0da; --color-4: #e2ddf0; --color-5: #ebebff. 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 earth-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