#A3B3B2 + #979678 + #E3E6D8 + #FAA634 + #C1C197 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A3B3B2

Jade · DarkGray · Lake Green

HEX

#A3B3B2

RGB

rgb(163, 179, 178)

HSL

hsl(176, 10%, 67%)

HSB

hsb(176, 9%, 70%)

CMYK

cmyk(9%, 0%, 1%, 30%)

Oklch

oklch(75.4% 0.018 192.2)

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

#979678

Autumn Sage · Gray · Sunflower

HEX

#979678

RGB

rgb(151, 150, 120)

HSL

hsl(58, 13%, 53%)

HSB

hsb(58, 21%, 59%)

CMYK

cmyk(0%, 1%, 21%, 41%)

Oklch

oklch(66.6% 0.043 105.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#E3E6D8

Willow Green · Beige · Mint Green

HEX

#E3E6D8

RGB

rgb(227, 230, 216)

HSL

hsl(73, 22%, 87%)

HSB

hsb(73, 6%, 90%)

CMYK

cmyk(1%, 0%, 6%, 10%)

Oklch

oklch(91.9% 0.019 116.6)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#FAA634

Ginger · GoldenRod · Warm Sun

HEX

#FAA634

RGB

rgb(250, 166, 52)

HSL

hsl(35, 95%, 59%)

HSB

hsb(35, 79%, 98%)

CMYK

cmyk(0%, 34%, 79%, 2%)

Oklch

oklch(79.0% 0.156 69.2)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#C1C197

Fresh Green · Tan · Sunflower

HEX

#C1C197

RGB

rgb(193, 193, 151)

HSL

hsl(60, 25%, 67%)

HSB

hsb(60, 22%, 76%)

CMYK

cmyk(0%, 0%, 22%, 24%)

Oklch

oklch(80.0% 0.057 107.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A3B3B2

B3A2A4

Analogous

A2B3AA

A3B3B2

A2ACB3

Triadic

A3B3B2

B2A2B3

B3B2A2

Split-Comp.

A3B3B2

B3A2AC

B3AAA2

Tetradic

A3B3B2

AAA2B3

B3A2A4

ACB3A2

Contrast Matrix WCAG 2.1 Contrast

A3B3B2	979678	E3E6D8	FAA634	C1C197
—	1.4 Fail	1.7 Fail	1.1 Fail	1.2 Fail
1.4 Fail	—	2.4 Fail	1.5 Fail	1.6 Fail
1.7 Fail	2.4 Fail	—	1.6 Fail	1.5 Fail
1.1 Fail	1.5 Fail	1.6 Fail	—	1.1 Fail
1.2 Fail	1.6 Fail	1.5 Fail	1.1 Fail	—

White BG

2.2Fail

3.0AA Large

1.3Fail

2.0Fail

1.9Fail

Black BG

9.6AAA

6.9AA

16.6AAA

10.6AAA

11.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAAAB2

97977F

E4E4DB

D6D550

C1C1A1

Deuteranopia

A9A8B2

979781

E4E4DC

DBE156

C1C1A4

Tritanopia

A4B2B2

978586

E3DEDF

F6656A

C1A9AB

Achromatopsia

AEAEAE

939393

E4E4E4

B2B2B2

BCBCBC

Shades & Tints Shades & Tints

#A3B3B2

Dark

Light

#979678

Dark

Light

#E3E6D8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a3b3b2;
  --color-2: #979678;
  --color-3: #e3e6d8;
  --color-4: #faa634;
  --color-5: #c1c197;
}

SCSS

$color-1: #a3b3b2;
$color-2: #979678;
$color-3: #e3e6d8;
$color-4: #faa634;
$color-5: #c1c197;

TAILWIND

colors: {
  'brand-1': '#a3b3b2',
  'brand-2': '#979678',
  'brand-3': '#e3e6d8',
  'brand-4': '#faa634',
  'brand-5': '#c1c197',
}

RGB Array

[163, 179, 178], [151, 150, 120], [227, 230, 216], [250, 166, 52], [193, 193, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A3B3B2, #979678, #E3E6D8, #FAA634, #C1C197 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: #a3b3b2; --color-2: #979678; --color-3: #e3e6d8; --color-4: #faa634; --color-5: #c1c197. 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