#D7DFB7 + #D9CDAF + #DFA9AE + #BE93A6 + #597C8D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D7DFB7

Willow Green · Wheat · Apple Green

HEX

#D7DFB7

RGB

rgb(215, 223, 183)

HSL

hsl(72, 38%, 80%)

HSB

hsb(72, 18%, 87%)

CMYK

cmyk(4%, 0%, 18%, 13%)

Oklch

oklch(88.7% 0.054 116.7)

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

#D9CDAF

Goose Yellow · Silver · Lemon Cream

HEX

#D9CDAF

RGB

rgb(217, 205, 175)

HSL

hsl(43, 36%, 77%)

HSB

hsb(43, 19%, 85%)

CMYK

cmyk(0%, 6%, 19%, 15%)

Oklch

oklch(85.0% 0.042 88.8)

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

#DFA9AE

Peach Pink · Tan · Coral Red

HEX

#DFA9AE

RGB

rgb(223, 169, 174)

HSL

hsl(354, 46%, 77%)

HSB

hsb(354, 24%, 87%)

CMYK

cmyk(0%, 24%, 22%, 13%)

Oklch

oklch(78.6% 0.064 12.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#BE93A6

Rouge · DarkGray · Rose Pink

HEX

#BE93A6

RGB

rgb(190, 147, 166)

HSL

hsl(333, 25%, 66%)

HSB

hsb(333, 23%, 75%)

CMYK

cmyk(0%, 23%, 13%, 25%)

Oklch

oklch(70.9% 0.057 350.4)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#597C8D

Slate Blue · SlateGray · Navy Blue

HEX

#597C8D

RGB

rgb(89, 124, 141)

HSL

hsl(200, 23%, 45%)

HSB

hsb(200, 37%, 55%)

CMYK

cmyk(37%, 12%, 0%, 45%)

Oklch

oklch(56.6% 0.048 229.5)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D7DFB7

C0B9DF

Analogous

DFD4B9

D7DFB7

C4DFB9

Triadic

D7DFB7

B9D8DF

DFB9D8

Split-Comp.

D7DFB7

B9C4DF

D4B9DF

Tetradic

D7DFB7

B9DFD4

C0B9DF

DFB9C4

Contrast Matrix WCAG 2.1 Contrast

D7DFB7	D9CDAF	DFA9AE	BE93A6	597C8D
—	1.1 Fail	1.5 Fail	1.9 Fail	3.2 AA Large
1.1 Fail	—	1.3 Fail	1.7 Fail	2.8 Fail
1.5 Fail	1.3 Fail	—	1.3 Fail	2.2 Fail
1.9 Fail	1.7 Fail	1.3 Fail	—	1.7 Fail
3.2 AA Large	2.8 Fail	2.2 Fail	1.7 Fail	—

White BG

1.4Fail

1.6Fail

2.0Fail

2.7Fail

4.5AA Large

Black BG

15.1AAA

13.3AAA

10.4AAA

7.9AAA

4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DADBC1

D4D4B6

C8C7AD

ABABA1

686889

Deuteranopia

DAD9C3

D5D5B8

CBCFAD

AEB1A0

666488

Tritanopia

D7C8CA

D8BCBD

DCACAC

BC9E9D

5B8685

Achromatopsia

D8D8D8

CDCDCD

BABABA

A2A2A2

737373

Shades & Tints Shades & Tints

#D7DFB7

Dark

Light

#D9CDAF

Dark

Light

#DFA9AE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d7dfb7;
  --color-2: #d9cdaf;
  --color-3: #dfa9ae;
  --color-4: #be93a6;
  --color-5: #597c8d;
}

SCSS

$color-1: #d7dfb7;
$color-2: #d9cdaf;
$color-3: #dfa9ae;
$color-4: #be93a6;
$color-5: #597c8d;

TAILWIND

colors: {
  'brand-1': '#d7dfb7',
  'brand-2': '#d9cdaf',
  'brand-3': '#dfa9ae',
  'brand-4': '#be93a6',
  'brand-5': '#597c8d',
}

RGB Array

[215, 223, 183], [217, 205, 175], [223, 169, 174], [190, 147, 166], [89, 124, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D7DFB7, #D9CDAF, #DFA9AE, #BE93A6, #597C8D 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: #d7dfb7; --color-2: #d9cdaf; --color-3: #dfa9ae; --color-4: #be93a6; --color-5: #597c8d. 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