#9DB6A3 + #DBD4BF + #FFE8CB + #F2B89B + #DB9782 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#9DB6A3

Celadon · DarkGray · Apple Green

HEX

#9DB6A3

RGB

rgb(157, 182, 163)

HSL

hsl(134, 15%, 66%)

HSB

hsb(134, 14%, 71%)

CMYK

cmyk(14%, 0%, 10%, 29%)

Oklch

oklch(75.2% 0.038 152.6)

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

#DBD4BF

Goose Yellow · LightGray · Lemon Cream

HEX

#DBD4BF

RGB

rgb(219, 212, 191)

HSL

hsl(45, 28%, 80%)

HSB

hsb(45, 13%, 86%)

CMYK

cmyk(0%, 3%, 13%, 14%)

Oklch

oklch(87.0% 0.029 91.7)

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

#FFE8CB

Goose Yellow · Bisque · Peach Orange

HEX

#FFE8CB

RGB

rgb(255, 232, 203)

HSL

hsl(33, 100%, 90%)

HSB

hsb(33, 20%, 100%)

CMYK

cmyk(0%, 9%, 20%, 0%)

Oklch

oklch(94.2% 0.046 73.6)

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

#F2B89B

Apricot · BurlyWood · Peach Orange

HEX

#F2B89B

RGB

rgb(242, 184, 155)

HSL

hsl(20, 77%, 78%)

HSB

hsb(20, 36%, 95%)

CMYK

cmyk(0%, 24%, 36%, 5%)

Oklch

oklch(82.8% 0.078 47.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#DB9782

Peach Pink · DarkSalmon · Coral Red

HEX

#DB9782

RGB

rgb(219, 151, 130)

HSL

hsl(14, 55%, 68%)

HSB

hsb(14, 41%, 86%)

CMYK

cmyk(0%, 31%, 41%, 14%)

Oklch

oklch(73.8% 0.088 37.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9DB6A3

B59BAF

Analogous

A2B59B

9DB6A3

9BB5AE

Triadic

9DB6A3

A19BB5

B5A19B

Split-Comp.

9DB6A3

AE9BB5

B59BA2

Tetradic

9DB6A3

9BA2B5

B59BAF

B5AE9B

Contrast Matrix WCAG 2.1 Contrast

9DB6A3	DBD4BF	FFE8CB	F2B89B	DB9782
—	1.5 Fail	1.8 Fail	1.3 Fail	1.1 Fail
1.5 Fail	—	1.2 Fail	1.2 Fail	1.6 Fail
1.8 Fail	1.2 Fail	—	1.5 Fail	2.0 Fail
1.3 Fail	1.2 Fail	1.5 Fail	—	1.4 Fail
1.1 Fail	1.6 Fail	2.0 Fail	1.4 Fail	—

White BG

2.2Fail

1.5Fail

1.2Fail

1.7Fail

2.4Fail

Black BG

9.7AAA

14.2AAA

17.7AAA

12.1AAA

8.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A8A8A8

D8D8C4

F5F5D2

D9D8A2

BEBD87

Deuteranopia

A6A5A9

D8D9C5

F6F8D4

DCE1A4

C2C788

Tritanopia

9EABAC

DBC8C9

FED8D9

EFA8A9

D88B8C

Achromatopsia

ACACAC

D4D4D4

ECECEC

C6C6C6

A9A9A9

Shades & Tints Shades & Tints

#9DB6A3

Dark

Light

#DBD4BF

Dark

Light

#FFE8CB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9db6a3;
  --color-2: #dbd4bf;
  --color-3: #ffe8cb;
  --color-4: #f2b89b;
  --color-5: #db9782;
}

SCSS

$color-1: #9db6a3;
$color-2: #dbd4bf;
$color-3: #ffe8cb;
$color-4: #f2b89b;
$color-5: #db9782;

TAILWIND

colors: {
  'brand-1': '#9db6a3',
  'brand-2': '#dbd4bf',
  'brand-3': '#ffe8cb',
  'brand-4': '#f2b89b',
  'brand-5': '#db9782',
}

RGB Array

[157, 182, 163], [219, 212, 191], [255, 232, 203], [242, 184, 155], [219, 151, 130]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9DB6A3, #DBD4BF, #FFE8CB, #F2B89B, #DB9782 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: #9db6a3; --color-2: #dbd4bf; --color-3: #ffe8cb; --color-4: #f2b89b; --color-5: #db9782. 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