← Back to Editor

#A9C1A1 · #BA9111 · #E7CA7A · #B9C097 · #91B1A6

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#A9C1A1

Celadon · DarkGray · Apple Green

HEX
#A9C1A1
RGB
rgb(169, 193, 161)
HSL
hsl(105, 21%, 69%)
HSB
hsb(105, 17%, 76%)
CMYK
cmyk(12%, 0%, 17%, 24%)
Oklch
oklch(78.4% 0.052 137.9)

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

#BA9111

Ochre · DarkGoldenRod · Honey Gold

HEX
#BA9111
RGB
rgb(186, 145, 17)
HSL
hsl(45, 83%, 40%)
HSB
hsb(45, 91%, 73%)
CMYK
cmyk(0%, 22%, 91%, 27%)
Oklch
oklch(67.7% 0.135 87.8)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#E7CA7A

Ginger · BurlyWood · Sunflower

HEX
#E7CA7A
RGB
rgb(231, 202, 122)
HSL
hsl(44, 69%, 69%)
HSB
hsb(44, 47%, 91%)
CMYK
cmyk(0%, 13%, 47%, 9%)
Oklch
oklch(84.6% 0.105 90.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#B9C097

Willow Green · Tan · Apple Green

HEX
#B9C097
RGB
rgb(185, 192, 151)
HSL
hsl(70, 25%, 67%)
HSB
hsb(70, 21%, 75%)
CMYK
cmyk(4%, 0%, 21%, 25%)
Oklch
oklch(79.2% 0.056 115.6)

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

#91B1A6

Jade · DarkGray · Apple Green

HEX
#91B1A6
RGB
rgb(145, 177, 166)
HSL
hsl(159, 17%, 63%)
HSB
hsb(159, 18%, 69%)
CMYK
cmyk(18%, 0%, 6%, 31%)
Oklch
oklch(73.3% 0.038 172.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A9C1A1
B89FC1

Analogous

B8C19F
A9C1A1
9FC1A8

Triadic

A9C1A1
9FA8C1
C19FA8

Split-Comp.

A9C1A1
A89FC1
C19FB8

Tetradic

A9C1A1
9FB8C1
B89FC1
C1A89F

Contrast Matrix WCAG 2.1 Contrast

A9C1A1
BA9111
E7CA7A
B9C097
91B1A6
—
1.5
Fail
1.2
Fail
1.0
Fail
1.2
Fail
1.5
Fail
—
1.8
Fail
1.5
Fail
1.3
Fail
1.2
Fail
1.8
Fail
—
1.2
Fail
1.5
Fail
1.0
Fail
1.5
Fail
1.2
Fail
—
1.2
Fail
1.2
Fail
1.3
Fail
1.5
Fail
1.2
Fail
—
White BG
1.9Fail
2.9Fail
1.6Fail
1.9Fail
2.3Fail
Black BG
10.8AAA
7.1AAA
13.1AAA
11.0AAA
9.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B3B4A9
A8A830
DADA8D
BCBCA1
9F9FA9

Deuteranopia

B2B0AB
ABAE37
DCDE92
BCBBA3
9D9BA9

Tritanopia

AAAFB0
B8484E
E69DA0
B9A9AA
93ABAB

Achromatopsia

B6B6B6
8F8F8F
CACACA
B9B9B9
A6A6A6

Shades & Tints Shades & Tints

#A9C1A1

Dark
Light

#BA9111

Dark
Light

#E7CA7A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a9c1a1;
  --color-2: #ba9111;
  --color-3: #e7ca7a;
  --color-4: #b9c097;
  --color-5: #91b1a6;
}

SCSS

$color-1: #a9c1a1;
$color-2: #ba9111;
$color-3: #e7ca7a;
$color-4: #b9c097;
$color-5: #91b1a6;

TAILWIND

colors: {
  'brand-1': '#a9c1a1',
  'brand-2': '#ba9111',
  'brand-3': '#e7ca7a',
  'brand-4': '#b9c097',
  'brand-5': '#91b1a6',
}

RGB Array

[169, 193, 161], [186, 145, 17], [231, 202, 122], [185, 192, 151], [145, 177, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A9C1A1, #BA9111, #E7CA7A, #B9C097, #91B1A6 is ideal for: corporate websites, product showcases, portfolios. 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: #a9c1a1; --color-2: #ba9111; --color-3: #e7ca7a; --color-4: #b9c097; --color-5: #91b1a6. 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. 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