#8AA6B4 + #CECCA9 + #A39A96 + #FBC9B0 + #D9D7AD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8AA6B4

Sky Blue · DarkGray · Cobalt Blue

HEX

#8AA6B4

RGB

rgb(138, 166, 180)

HSL

hsl(200, 22%, 62%)

HSB

hsb(200, 23%, 71%)

CMYK

cmyk(23%, 8%, 0%, 29%)

Oklch

oklch(70.9% 0.037 229.6)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#CECCA9

Fresh Green · Silver · Sunflower

HEX

#CECCA9

RGB

rgb(206, 204, 169)

HSL

hsl(57, 27%, 74%)

HSB

hsb(57, 18%, 81%)

CMYK

cmyk(0%, 1%, 18%, 19%)

Oklch

oklch(83.8% 0.047 104.7)

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

#A39A96

Ash · DarkGray · Silver Sand

HEX

#A39A96

RGB

rgb(163, 154, 150)

HSL

hsl(18, 7%, 61%)

HSB

hsb(18, 8%, 64%)

CMYK

cmyk(0%, 6%, 8%, 36%)

Oklch

oklch(69.3% 0.012 45.7)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#FBC9B0

Apricot · Wheat · Peach Orange

HEX

#FBC9B0

RGB

rgb(251, 201, 176)

HSL

hsl(20, 90%, 84%)

HSB

hsb(20, 30%, 98%)

CMYK

cmyk(0%, 20%, 30%, 2%)

Oklch

oklch(87.3% 0.066 47.9)

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

#D9D7AD

Fresh Green · Wheat · Lemon Cream

HEX

#D9D7AD

RGB

rgb(217, 215, 173)

HSL

hsl(57, 37%, 76%)

HSB

hsb(57, 20%, 85%)

CMYK

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

Oklch

oklch(87.0% 0.056 105.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8AA6B4

B39789

Analogous

89B3AC

8AA6B4

8990B3

Triadic

8AA6B4

B389A5

A5B389

Split-Comp.

8AA6B4

B38990

B3AC89

Tetradic

8AA6B4

AC89B3

B39789

90B389

Contrast Matrix WCAG 2.1 Contrast

8AA6B4	CECCA9	A39A96	FBC9B0	D9D7AD
—	1.6 Fail	1.1 Fail	1.7 Fail	1.7 Fail
1.6 Fail	—	1.7 Fail	1.1 Fail	1.1 Fail
1.1 Fail	1.7 Fail	—	1.8 Fail	1.9 Fail
1.7 Fail	1.1 Fail	1.8 Fail	—	1.0 Fail
1.7 Fail	1.1 Fail	1.9 Fail	1.0 Fail	—

White BG

2.6Fail

1.6Fail

2.8Fail

1.5Fail

Black BG

8.2AAA

12.8AAA

7.6AAA

14.1AAA

14.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9696B1

CDCDB1

9F9F97

E5E5B6

D8D8B7

Deuteranopia

9592B0

CDCDB4

A0A097

E8ECB8

D8D8BA

Tritanopia

8BAEAD

CEB8BA

A39898

F9BBBC

D9BFC1

Achromatopsia

9F9F9F

C9C9C9

9C9C9C

D5D5D5

D3D3D3

Shades & Tints Shades & Tints

#8AA6B4

Dark

Light

#CECCA9

Dark

Light

#A39A96

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8aa6b4;
  --color-2: #cecca9;
  --color-3: #a39a96;
  --color-4: #fbc9b0;
  --color-5: #d9d7ad;
}

SCSS

$color-1: #8aa6b4;
$color-2: #cecca9;
$color-3: #a39a96;
$color-4: #fbc9b0;
$color-5: #d9d7ad;

TAILWIND

colors: {
  'brand-1': '#8aa6b4',
  'brand-2': '#cecca9',
  'brand-3': '#a39a96',
  'brand-4': '#fbc9b0',
  'brand-5': '#d9d7ad',
}

RGB Array

[138, 166, 180], [206, 204, 169], [163, 154, 150], [251, 201, 176], [217, 215, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8AA6B4, #CECCA9, #A39A96, #FBC9B0, #D9D7AD 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: #8aa6b4; --color-2: #cecca9; --color-3: #a39a96; --color-4: #fbc9b0; --color-5: #d9d7ad. 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