← Back to Editor

#A1B99A · #8E9780 · #A3CBB2 · #73675C · #7B7365

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#A1B99A

Celadon · DarkSeaGreen · Apple Green

HEX
#A1B99A
RGB
rgb(161, 185, 154)
HSL
hsl(106, 18%, 66%)
HSB
hsb(106, 17%, 73%)
CMYK
cmyk(13%, 0%, 17%, 27%)
Oklch
oklch(75.9% 0.051 138.6)

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

#8E9780

Grass Green · Gray · Olive Green

HEX
#8E9780
RGB
rgb(142, 151, 128)
HSL
hsl(83, 10%, 55%)
HSB
hsb(83, 15%, 59%)
CMYK
cmyk(6%, 0%, 15%, 41%)
Oklch
oklch(66.3% 0.035 124.8)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#A3CBB2

Celadon · Silver · Apple Green

HEX
#A3CBB2
RGB
rgb(163, 203, 178)
HSL
hsl(143, 28%, 72%)
HSB
hsb(143, 20%, 80%)
CMYK
cmyk(20%, 0%, 12%, 20%)
Oklch
oklch(80.6% 0.055 157.5)

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

#73675C

Tangerine · DimGray · Amber Brown

HEX
#73675C
RGB
rgb(115, 103, 92)
HSL
hsl(29, 11%, 41%)
HSB
hsb(29, 20%, 45%)
CMYK
cmyk(0%, 10%, 20%, 55%)
Oklch
oklch(52.2% 0.023 64.8)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#7B7365

Ochre · DimGray · Amber Brown

HEX
#7B7365
RGB
rgb(123, 115, 101)
HSL
hsl(38, 10%, 44%)
HSB
hsb(38, 18%, 48%)
CMYK
cmyk(0%, 7%, 18%, 52%)
Oklch
oklch(55.9% 0.023 81.7)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A1B99A
B199B8

Analogous

B0B899
A1B99A
99B8A1

Triadic

A1B99A
99A0B8
B899A0

Split-Comp.

A1B99A
A199B8
B899B0

Tetradic

A1B99A
99B0B8
B199B8
B8A199

Contrast Matrix WCAG 2.1 Contrast

A1B99A
8E9780
A3CBB2
73675C
7B7365
—
1.4
Fail
1.2
Fail
2.6
Fail
2.2
Fail
1.4
Fail
—
1.7
Fail
1.8
Fail
1.5
Fail
1.2
Fail
1.7
Fail
—
3.1
AA Large
2.6
Fail
2.6
Fail
1.8
Fail
3.1
AA Large
—
1.2
Fail
2.2
Fail
1.5
Fail
2.6
Fail
1.2
Fail
—
White BG
2.1Fail
3.0AA Large
1.8Fail
5.5AA
4.7AA
Black BG
9.9AAA
6.9AA
11.7AAA
3.8AA Large
4.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

ABACA2
929286
B4B5B8
6E6E5F
787768

Deuteranopia

AAA8A3
919187
B2AFBA
6F6F5F
787969

Tritanopia

A2A7A9
8E8A8B
A5BDBE
726161
7B6B6C

Achromatopsia

AEAEAE
929292
BCBCBC
696969
747474

Shades & Tints Shades & Tints

#A1B99A

Dark
Light

#8E9780

Dark
Light

#A3CBB2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a1b99a;
  --color-2: #8e9780;
  --color-3: #a3cbb2;
  --color-4: #73675c;
  --color-5: #7b7365;
}

SCSS

$color-1: #a1b99a;
$color-2: #8e9780;
$color-3: #a3cbb2;
$color-4: #73675c;
$color-5: #7b7365;

TAILWIND

colors: {
  'brand-1': '#a1b99a',
  'brand-2': '#8e9780',
  'brand-3': '#a3cbb2',
  'brand-4': '#73675c',
  'brand-5': '#7b7365',
}

RGB Array

[161, 185, 154], [142, 151, 128], [163, 203, 178], [115, 103, 92], [123, 115, 101]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A1B99A, #8E9780, #A3CBB2, #73675C, #7B7365 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #a1b99a; --color-2: #8e9780; --color-3: #a3cbb2; --color-4: #73675c; --color-5: #7b7365. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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. Restrained colors convey professionalism and trust. 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