← Back to Editor

#A9C8B0 · #CCD295 · #C5AE81 · #9E7F7D · #7D405D

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

#A9C8B0

Celadon · Silver · Apple Green

HEX
#A9C8B0
RGB
rgb(169, 200, 176)
HSL
hsl(134, 22%, 72%)
HSB
hsb(134, 16%, 78%)
CMYK
cmyk(16%, 0%, 12%, 22%)
Oklch
oklch(80.3% 0.047 152.0)

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

#CCD295

Fresh Green · Tan · Sunflower

HEX
#CCD295
RGB
rgb(204, 210, 149)
HSL
hsl(66, 40%, 70%)
HSB
hsb(66, 29%, 82%)
CMYK
cmyk(3%, 0%, 29%, 18%)
Oklch
oklch(84.4% 0.080 112.7)

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

#C5AE81

Ginger · Tan · Sunflower

HEX
#C5AE81
RGB
rgb(197, 174, 129)
HSL
hsl(40, 37%, 64%)
HSB
hsb(40, 35%, 77%)
CMYK
cmyk(0%, 12%, 35%, 23%)
Oklch
oklch(76.0% 0.066 83.9)

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

#9E7F7D

Crimson · Gray · Passion Red

HEX
#9E7F7D
RGB
rgb(158, 127, 125)
HSL
hsl(4, 15%, 55%)
HSB
hsb(4, 21%, 62%)
CMYK
cmyk(0%, 20%, 21%, 38%)
Oklch
oklch(62.5% 0.039 22.5)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#7D405D

Dark Violet · DimGray · Camellia

HEX
#7D405D
RGB
rgb(125, 64, 93)
HSL
hsl(331, 32%, 37%)
HSB
hsb(331, 49%, 49%)
CMYK
cmyk(0%, 49%, 26%, 51%)
Oklch
oklch(45.7% 0.092 351.5)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A9C8B0
C7A8C0

Analogous

B0C7A8
A9C8B0
A8C7BF

Triadic

A9C8B0
AFA8C7
C7AFA8

Split-Comp.

A9C8B0
BFA8C7
C7A8B0

Tetradic

A9C8B0
A8B0C7
C7A8C0
C7BFA8

Contrast Matrix WCAG 2.1 Contrast

A9C8B0
CCD295
C5AE81
9E7F7D
7D405D
—
1.1
Fail
1.2
Fail
2.0
Fail
4.2
AA Large
1.1
Fail
—
1.4
Fail
2.3
Fail
4.8
AA
1.2
Fail
1.4
Fail
—
1.7
Fail
3.5
AA Large
2.0
Fail
2.3
Fail
1.7
Fail
—
2.1
Fail
4.2
AA Large
4.8
AA
3.5
AA Large
2.1
Fail
—
White BG
1.8Fail
1.6Fail
2.2Fail
3.6AA Large
7.6AAA
Black BG
11.6AAA
13.2AAA
9.7AAA
5.8AA
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B7B6
CFCFA4
BBBB8C
91907D
636256

Deuteranopia

B5B2B7
CECEA7
BCBE8F
92957E
666B54

Tritanopia

ABBABB
CCAFB2
C49496
9C7E7E
7A504F

Achromatopsia

BCBCBC
C9C9C9
B0B0B0
888888
565656

Shades & Tints Shades & Tints

#A9C8B0

Dark
Light

#CCD295

Dark
Light

#C5AE81

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a9c8b0;
  --color-2: #ccd295;
  --color-3: #c5ae81;
  --color-4: #9e7f7d;
  --color-5: #7d405d;
}

SCSS

$color-1: #a9c8b0;
$color-2: #ccd295;
$color-3: #c5ae81;
$color-4: #9e7f7d;
$color-5: #7d405d;

TAILWIND

colors: {
  'brand-1': '#a9c8b0',
  'brand-2': '#ccd295',
  'brand-3': '#c5ae81',
  'brand-4': '#9e7f7d',
  'brand-5': '#7d405d',
}

RGB Array

[169, 200, 176], [204, 210, 149], [197, 174, 129], [158, 127, 125], [125, 64, 93]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A9C8B0, #CCD295, #C5AE81, #9E7F7D, #7D405D 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: #a9c8b0; --color-2: #ccd295; --color-3: #c5ae81; --color-4: #9e7f7d; --color-5: #7d405d. 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