#9DB5B3 + #D3C5B4 + #E7B395 + #F48D85 + #E56673 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#9DB5B3

Jade · DarkGray · Lake Green

HEX

#9DB5B3

RGB

rgb(157, 181, 179)

HSL

hsl(175, 14%, 66%)

HSB

hsb(175, 13%, 71%)

CMYK

cmyk(13%, 0%, 1%, 29%)

Oklch

oklch(75.4% 0.027 190.5)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#D3C5B4

Goose Yellow · Silver · Peach Orange

HEX

#D3C5B4

RGB

rgb(211, 197, 180)

HSL

hsl(33, 26%, 77%)

HSB

hsb(33, 15%, 83%)

CMYK

cmyk(0%, 7%, 15%, 17%)

Oklch

oklch(83.0% 0.028 72.8)

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

#E7B395

Apricot · BurlyWood · Warm Sun

HEX

#E7B395

RGB

rgb(231, 179, 149)

HSL

hsl(22, 63%, 75%)

HSB

hsb(22, 35%, 91%)

CMYK

cmyk(0%, 23%, 35%, 9%)

Oklch

oklch(80.7% 0.073 51.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#F48D85

Peach Pink · LightCoral · Coral Red

HEX

#F48D85

RGB

rgb(244, 141, 133)

HSL

hsl(4, 83%, 74%)

HSB

hsb(4, 45%, 96%)

CMYK

cmyk(0%, 42%, 45%, 4%)

Oklch

oklch(75.1% 0.126 25.2)

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

#E56673

Peach Pink · LightCoral · Coral Red

HEX

#E56673

RGB

rgb(229, 102, 115)

HSL

hsl(354, 71%, 65%)

HSB

hsb(354, 55%, 90%)

CMYK

cmyk(0%, 55%, 50%, 10%)

Oklch

oklch(66.9% 0.158 16.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9DB5B3

B49C9E

Analogous

9CB4A6

9DB5B3

9CAAB4

Triadic

9DB5B3

B29CB4

B4B29C

Split-Comp.

9DB5B3

B49CAA

B4A69C

Tetradic

9DB5B3

A69CB4

B49C9E

AAB49C

Contrast Matrix WCAG 2.1 Contrast

9DB5B3	D3C5B4	E7B395	F48D85	E56673
—	1.3 Fail	1.2 Fail	1.1 Fail	1.5 Fail
1.3 Fail	—	1.1 Fail	1.4 Fail	1.9 Fail
1.2 Fail	1.1 Fail	—	1.3 Fail	1.7 Fail
1.1 Fail	1.4 Fail	1.3 Fail	—	1.4 Fail
1.5 Fail	1.9 Fail	1.7 Fail	1.4 Fail	—

White BG

2.2Fail

1.7Fail

1.9Fail

2.3Fail

3.2AA Large

Black BG

9.7AAA

12.4AAA

11.3AAA

9.0AAA

6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A8B3

CDCDB8

D0D09C

C7C687

AEAD70

Deuteranopia

A6A4B4

CECFB9

D4D79E

CDD587

B5BF6F

Tritanopia

9EB4B4

D2BBBC

E4A2A3

EF8889

DF6D6D

Achromatopsia

AEAEAE

C7C7C7

BFBFBF

ABABAB

8D8D8D

Shades & Tints Shades & Tints

#9DB5B3

Dark

Light

#D3C5B4

Dark

Light

#E7B395

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9db5b3;
  --color-2: #d3c5b4;
  --color-3: #e7b395;
  --color-4: #f48d85;
  --color-5: #e56673;
}

SCSS

$color-1: #9db5b3;
$color-2: #d3c5b4;
$color-3: #e7b395;
$color-4: #f48d85;
$color-5: #e56673;

TAILWIND

colors: {
  'brand-1': '#9db5b3',
  'brand-2': '#d3c5b4',
  'brand-3': '#e7b395',
  'brand-4': '#f48d85',
  'brand-5': '#e56673',
}

RGB Array

[157, 181, 179], [211, 197, 180], [231, 179, 149], [244, 141, 133], [229, 102, 115]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9DB5B3, #D3C5B4, #E7B395, #F48D85, #E56673 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: #9db5b3; --color-2: #d3c5b4; --color-3: #e7b395; --color-4: #f48d85; --color-5: #e56673. 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