#8792A0 + #A7C1AD + #DAD7A4 + #FAED92 + #F9E864 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8792A0

Azure · LightSlateGray · Navy Blue

HEX

#8792A0

RGB

rgb(135, 146, 160)

HSL

hsl(214, 12%, 58%)

HSB

hsb(214, 16%, 63%)

CMYK

cmyk(16%, 9%, 0%, 37%)

Oklch

oklch(65.6% 0.024 254.5)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#A7C1AD

Celadon · DarkGray · Apple Green

HEX

#A7C1AD

RGB

rgb(167, 193, 173)

HSL

hsl(134, 17%, 71%)

HSB

hsb(134, 13%, 76%)

CMYK

cmyk(13%, 0%, 10%, 24%)

Oklch

oklch(78.6% 0.040 152.3)

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

#DAD7A4

Fresh Green · Wheat · Sunflower

HEX

#DAD7A4

RGB

rgb(218, 215, 164)

HSL

hsl(57, 42%, 75%)

HSB

hsb(57, 25%, 85%)

CMYK

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

Oklch

oklch(86.9% 0.067 104.9)

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

#FAED92

Fresh Green · Khaki · Lemon Cream

HEX

#FAED92

RGB

rgb(250, 237, 146)

HSL

hsl(53, 91%, 78%)

HSB

hsb(53, 42%, 98%)

CMYK

cmyk(0%, 5%, 42%, 2%)

Oklch

oklch(93.7% 0.113 101.2)

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

#F9E864

Fresh Green · Khaki · Sunflower

HEX

#F9E864

RGB

rgb(249, 232, 100)

HSL

hsl(53, 93%, 68%)

HSB

hsb(53, 60%, 98%)

CMYK

cmyk(0%, 7%, 60%, 2%)

Oklch

oklch(92.0% 0.152 102.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8792A0

A19687

Analogous

879FA1

8792A0

8987A1

Triadic

8792A0

A18792

92A187

Split-Comp.

8792A0

A18987

9FA187

Tetradic

8792A0

A1879F

A19687

87A189

Contrast Matrix WCAG 2.1 Contrast

8792A0	A7C1AD	DAD7A4	FAED92	F9E864
—	1.6 Fail	2.1 Fail	2.6 Fail	2.5 Fail
1.6 Fail	—	1.3 Fail	1.6 Fail	1.5 Fail
2.1 Fail	1.3 Fail	—	1.2 Fail	1.2 Fail
2.6 Fail	1.6 Fail	1.2 Fail	—	1.1 Fail
2.5 Fail	1.5 Fail	1.2 Fail	1.1 Fail	—

White BG

3.2AA Large

1.9Fail

1.5Fail

1.2Fail

1.3Fail

Black BG

6.6AA

10.9AAA

14.2AAA

17.6AAA

16.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8C9D

B2B2B2

D9D9B0

F4F4A8

F2F184

Deuteranopia

8B8A9C

B1AFB3

D9D9B3

F5F6AD

F3F48C

Tritanopia

889A99

A8B6B7

DABABC

F9B9BD

F89DA3

Achromatopsia

909090

B7B7B7

D2D2D2

E7E7E7

DEDEDE

Shades & Tints Shades & Tints

#8792A0

Dark

Light

#A7C1AD

Dark

Light

#DAD7A4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8792a0;
  --color-2: #a7c1ad;
  --color-3: #dad7a4;
  --color-4: #faed92;
  --color-5: #f9e864;
}

SCSS

$color-1: #8792a0;
$color-2: #a7c1ad;
$color-3: #dad7a4;
$color-4: #faed92;
$color-5: #f9e864;

TAILWIND

colors: {
  'brand-1': '#8792a0',
  'brand-2': '#a7c1ad',
  'brand-3': '#dad7a4',
  'brand-4': '#faed92',
  'brand-5': '#f9e864',
}

RGB Array

[135, 146, 160], [167, 193, 173], [218, 215, 164], [250, 237, 146], [249, 232, 100]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8792A0, #A7C1AD, #DAD7A4, #FAED92, #F9E864 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: #8792a0; --color-2: #a7c1ad; --color-3: #dad7a4; --color-4: #faed92; --color-5: #f9e864. 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