#9D867F + #DC7C66 + #FFFFE7 + #F8DFAF + #C6BAA6 · skin - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#9D867F

Crimson · Gray · Passion Red

HEX

#9D867F

RGB

rgb(157, 134, 127)

HSL

hsl(14, 13%, 56%)

HSB

hsb(14, 19%, 62%)

CMYK

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

Oklch

oklch(63.9% 0.030 37.6)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#DC7C66

Peach Pink · Salmon · Coral Red

HEX

#DC7C66

RGB

rgb(220, 124, 102)

HSL

hsl(11, 63%, 63%)

HSB

hsb(11, 54%, 86%)

CMYK

cmyk(0%, 44%, 54%, 14%)

Oklch

oklch(68.7% 0.124 33.9)

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

#FFFFE7

Fresh Green · LightYellow · Lemon Cream

HEX

#FFFFE7

RGB

rgb(255, 255, 231)

HSL

hsl(60, 100%, 95%)

HSB

hsb(60, 9%, 100%)

CMYK

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

Oklch

oklch(99.4% 0.031 107.0)

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

#F8DFAF

Goose Yellow · Wheat · Peach Orange

HEX

#F8DFAF

RGB

rgb(248, 223, 175)

HSL

hsl(39, 84%, 83%)

HSB

hsb(39, 29%, 97%)

CMYK

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

Oklch

oklch(91.3% 0.068 83.6)

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

#C6BAA6

Goose Yellow · Silver · Warm Sun

HEX

#C6BAA6

RGB

rgb(198, 186, 166)

HSL

hsl(37, 22%, 71%)

HSB

hsb(37, 16%, 78%)

CMYK

cmyk(0%, 6%, 16%, 22%)

Oklch

oklch(79.3% 0.031 80.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9D867F

80979D

Analogous

9D8088

9D867F

9D9680

Triadic

9D867F

809D87

87809D

Split-Comp.

9D867F

809D96

80889D

Tetradic

9D867F

889D80

80979D

96809D

Contrast Matrix WCAG 2.1 Contrast

9D867F	DC7C66	FFFFE7	F8DFAF	C6BAA6
—	1.2 Fail	3.4 AA Large	2.6 Fail	1.8 Fail
1.2 Fail	—	2.9 Fail	2.3 Fail	1.5 Fail
3.4 AA Large	2.9 Fail	—	1.3 Fail	1.9 Fail
2.6 Fail	2.3 Fail	1.3 Fail	—	1.5 Fail
1.8 Fail	1.5 Fail	1.9 Fail	1.5 Fail	—

White BG

3.4AA Large

3.0Fail

1.0Fail

1.3Fail

1.9Fail

Black BG

6.2AA

7.1AAA

20.7AAA

16.2AAA

11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

939381

B2B26B

FFFFED

EDEDBB

C1C1AB

Deuteranopia

949681

B8BF6D

FFFFEE

EFF1BD

C2C2AC

Tritanopia

9C8282

D77070

FFF1F2

F7C4C6

C5AFB0

Achromatopsia

8C8C8C

969696

FCFCFC

E1E1E1

BBBBBB

Shades & Tints Shades & Tints

#9D867F

Dark

Light

#DC7C66

Dark

Light

#FFFFE7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9d867f;
  --color-2: #dc7c66;
  --color-3: #ffffe7;
  --color-4: #f8dfaf;
  --color-5: #c6baa6;
}

SCSS

$color-1: #9d867f;
$color-2: #dc7c66;
$color-3: #ffffe7;
$color-4: #f8dfaf;
$color-5: #c6baa6;

TAILWIND

colors: {
  'brand-1': '#9d867f',
  'brand-2': '#dc7c66',
  'brand-3': '#ffffe7',
  'brand-4': '#f8dfaf',
  'brand-5': '#c6baa6',
}

RGB Array

[157, 134, 127], [220, 124, 102], [255, 255, 231], [248, 223, 175], [198, 186, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This skin-style palette of #9D867F, #DC7C66, #FFFFE7, #F8DFAF, #C6BAA6 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: #9d867f; --color-2: #dc7c66; --color-3: #ffffe7; --color-4: #f8dfaf; --color-5: #c6baa6. 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 skin-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