#996E88 + #CC8A6B + #FFA64D + #ECBF8A + #D9D7C7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#996E88

Rose Purple · Gray · Rose Pink

HEX

#996E88

RGB

rgb(153, 110, 136)

HSL

hsl(324, 17%, 52%)

HSB

hsb(324, 28%, 60%)

CMYK

cmyk(0%, 28%, 11%, 40%)

Oklch

oklch(59.0% 0.065 342.4)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

#CC8A6B

Apricot · DarkSalmon · Warm Sun

HEX

#CC8A6B

RGB

rgb(204, 138, 107)

HSL

hsl(19, 49%, 61%)

HSB

hsb(19, 48%, 80%)

CMYK

cmyk(0%, 32%, 48%, 20%)

Oklch

oklch(69.3% 0.092 45.9)

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

#FFA64D

Ginger · SandyBrown · Warm Sun

HEX

#FFA64D

RGB

rgb(255, 166, 77)

HSL

hsl(30, 100%, 65%)

HSB

hsb(30, 70%, 100%)

CMYK

cmyk(0%, 35%, 70%, 0%)

Oklch

oklch(79.8% 0.147 62.7)

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

#ECBF8A

Goose Yellow · BurlyWood · Warm Sun

HEX

#ECBF8A

RGB

rgb(236, 191, 138)

HSL

hsl(32, 72%, 73%)

HSB

hsb(32, 42%, 93%)

CMYK

cmyk(0%, 19%, 42%, 7%)

Oklch

oklch(83.2% 0.086 70.8)

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

#D9D7C7

Fresh Green · LightGray · Lemon Cream

HEX

#D9D7C7

RGB

rgb(217, 215, 199)

HSL

hsl(53, 19%, 82%)

HSB

hsb(53, 8%, 85%)

CMYK

cmyk(0%, 1%, 8%, 15%)

Oklch

oklch(87.6% 0.022 101.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

996E88

709980

Analogous

957099

996E88

997074

Triadic

996E88

899970

708999

Split-Comp.

996E88

749970

709995

Tetradic

996E88

999570

709980

707499

Contrast Matrix WCAG 2.1 Contrast

996E88	CC8A6B	FFA64D	ECBF8A	D9D7C7
—	1.5 Fail	2.2 Fail	2.5 Fail	2.9 Fail
1.5 Fail	—	1.5 Fail	1.7 Fail	2.0 Fail
2.2 Fail	1.5 Fail	—	1.1 Fail	1.3 Fail
2.5 Fail	1.7 Fail	1.1 Fail	—	1.2 Fail
2.9 Fail	2.0 Fail	1.3 Fail	1.2 Fail	—

White BG

4.3AA Large

2.8Fail

1.9Fail

1.7Fail

1.4Fail

Black BG

4.9AA

7.4AAA

10.8AAA

12.4AAA

14.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

868682

AFAF73

D8D863

D9D897

D8D8CB

Deuteranopia

898C80

B3B874

DEE468

DBDF9A

D8D8CC

Tritanopia

977D7C

C9787A

FB7477

EAA1A3

D9CECF

Achromatopsia

7E7E7E

9A9A9A

B6B6B6

C6C6C6

D6D6D6

Shades & Tints Shades & Tints

#996E88

Dark

Light

#CC8A6B

Dark

Light

#FFA64D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #996e88;
  --color-2: #cc8a6b;
  --color-3: #ffa64d;
  --color-4: #ecbf8a;
  --color-5: #d9d7c7;
}

SCSS

$color-1: #996e88;
$color-2: #cc8a6b;
$color-3: #ffa64d;
$color-4: #ecbf8a;
$color-5: #d9d7c7;

TAILWIND

colors: {
  'brand-1': '#996e88',
  'brand-2': '#cc8a6b',
  'brand-3': '#ffa64d',
  'brand-4': '#ecbf8a',
  'brand-5': '#d9d7c7',
}

RGB Array

[153, 110, 136], [204, 138, 107], [255, 166, 77], [236, 191, 138], [217, 215, 199]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #996E88, #CC8A6B, #FFA64D, #ECBF8A, #D9D7C7 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: #996e88; --color-2: #cc8a6b; --color-3: #ffa64d; --color-4: #ecbf8a; --color-5: #d9d7c7. 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