← Back to Editor

#C8D2AF · #19243C · #C2899A · #E3D0D2 · #8DB0A8

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 LibraryData Visualization

Color Details Color Details

#C8D2AF

Willow Green · Silver · Apple Green

HEX
#C8D2AF
RGB
rgb(200, 210, 175)
HSL
hsl(77, 28%, 75%)
HSB
hsb(77, 17%, 82%)
CMYK
cmyk(5%, 0%, 17%, 18%)
Oklch
oklch(84.7% 0.048 120.4)

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

#19243C

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#19243C
RGB
rgb(25, 36, 60)
HSL
hsl(221, 41%, 17%)
HSB
hsb(221, 58%, 24%)
CMYK
cmyk(58%, 40%, 0%, 76%)
Oklch
oklch(26.3% 0.048 264.6)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#C2899A

Rouge · DarkGray · Rose Pink

HEX
#C2899A
RGB
rgb(194, 137, 154)
HSL
hsl(342, 32%, 65%)
HSB
hsb(342, 29%, 76%)
CMYK
cmyk(0%, 29%, 21%, 24%)
Oklch
oklch(69.1% 0.073 359.7)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#E3D0D2

Peach Pink · LightGray · Cherry Blossom

HEX
#E3D0D2
RGB
rgb(227, 208, 210)
HSL
hsl(354, 25%, 85%)
HSB
hsb(354, 8%, 89%)
CMYK
cmyk(0%, 8%, 7%, 11%)
Oklch
oklch(87.4% 0.021 10.3)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#8DB0A8

Jade · DarkSeaGreen · Lake Green

HEX
#8DB0A8
RGB
rgb(141, 176, 168)
HSL
hsl(166, 18%, 62%)
HSB
hsb(166, 20%, 69%)
CMYK
cmyk(20%, 0%, 5%, 31%)
Oklch
oklch(72.9% 0.040 179.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C8D2AF
B8ADD1

Analogous

D1C9AD
C8D2AF
B5D1AD

Triadic

C8D2AF
ADC7D1
D1ADC7

Split-Comp.

C8D2AF
ADB5D1
C9ADD1

Tetradic

C8D2AF
ADD1C9
B8ADD1
D1ADB5

Contrast Matrix WCAG 2.1 Contrast

C8D2AF
19243C
C2899A
E3D0D2
8DB0A8
—
9.8
AAA
1.8
Fail
1.1
Fail
1.5
Fail
9.8
AAA
—
5.4
AA
10.5
AAA
6.6
AA
1.8
Fail
5.4
AA
—
1.9
Fail
1.2
Fail
1.1
Fail
10.5
AAA
1.9
Fail
—
1.6
Fail
1.5
Fail
6.6
AA
1.2
Fail
1.6
Fail
—
White BG
1.6Fail
15.5AAA
2.9Fail
1.5Fail
2.4Fail
Black BG
13.3AAA
1.4Fail
7.3AAA
14.2AAA
8.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCCB7
1E1E36
A9A996
DBDBD2
9C9CAA

Deuteranopia

CCCBBA
1D1C35
ADB195
DCDDD1
9A98AA

Tritanopia

C9BEC0
1A3231
BF9392
E2D1D1
8FABAC

Achromatopsia

CBCBCB
232323
9C9C9C
D6D6D6
A5A5A5

Shades & Tints Shades & Tints

#C8D2AF

Dark
Light

#19243C

Dark
Light

#C2899A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c8d2af;
  --color-2: #19243c;
  --color-3: #c2899a;
  --color-4: #e3d0d2;
  --color-5: #8db0a8;
}

SCSS

$color-1: #c8d2af;
$color-2: #19243c;
$color-3: #c2899a;
$color-4: #e3d0d2;
$color-5: #8db0a8;

TAILWIND

colors: {
  'brand-1': '#c8d2af',
  'brand-2': '#19243c',
  'brand-3': '#c2899a',
  'brand-4': '#e3d0d2',
  'brand-5': '#8db0a8',
}

RGB Array

[200, 210, 175], [25, 36, 60], [194, 137, 154], [227, 208, 210], [141, 176, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C8D2AF, #19243C, #C2899A, #E3D0D2, #8DB0A8 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #c8d2af; --color-2: #19243c; --color-3: #c2899a; --color-4: #e3d0d2; --color-5: #8db0a8. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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