← Back to Editor

#C85D98 · #AB5A7C · #868876 · #89A784 · #A6B16F

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

#C85D98

Rose Purple · LightCoral · Rose Pink

HEX
#C85D98
RGB
rgb(200, 93, 152)
HSL
hsl(327, 49%, 57%)
HSB
hsb(327, 54%, 78%)
CMYK
cmyk(0%, 53%, 24%, 22%)
Oklch
oklch(62.7% 0.152 348.1)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

#AB5A7C

Dark Violet · Gray · Rose Pink

HEX
#AB5A7C
RGB
rgb(171, 90, 124)
HSL
hsl(335, 33%, 51%)
HSB
hsb(335, 47%, 67%)
CMYK
cmyk(0%, 47%, 27%, 33%)
Oklch
oklch(57.3% 0.113 354.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#868876

Ink Gray · Gray · Warm Gray

HEX
#868876
RGB
rgb(134, 136, 118)
HSL
hsl(67, 7%, 50%)
HSB
hsb(67, 13%, 53%)
CMYK
cmyk(1%, 0%, 13%, 47%)
Oklch
oklch(62.0% 0.026 112.3)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#89A784

Celadon · DarkSeaGreen · Olive Green

HEX
#89A784
RGB
rgb(137, 167, 132)
HSL
hsl(111, 17%, 59%)
HSB
hsb(111, 21%, 65%)
CMYK
cmyk(18%, 0%, 21%, 35%)
Oklch
oklch(69.6% 0.060 141.1)

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

#A6B16F

Grass Green · DarkSeaGreen · Olive Green

HEX
#A6B16F
RGB
rgb(166, 177, 111)
HSL
hsl(70, 30%, 56%)
HSB
hsb(70, 37%, 69%)
CMYK
cmyk(6%, 0%, 37%, 31%)
Oklch
oklch(73.6% 0.089 116.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C85D98
5CC78C

Analogous

C25CC7
C85D98
C75C61

Triadic

C85D98
97C75C
5C97C7

Split-Comp.

C85D98
61C75C
5CC7C2

Tetradic

C85D98
C7C25C
5CC78C
5C61C7

Contrast Matrix WCAG 2.1 Contrast

C85D98
AB5A7C
868876
89A784
A6B16F
—
1.2
Fail
1.1
Fail
1.4
Fail
1.7
Fail
1.2
Fail
—
1.3
Fail
1.8
Fail
2.0
Fail
1.1
Fail
1.3
Fail
—
1.4
Fail
1.6
Fail
1.4
Fail
1.8
Fail
1.4
Fail
—
1.2
Fail
1.7
Fail
2.0
Fail
1.6
Fail
1.2
Fail
—
White BG
3.8AA Large
4.7AA
3.6AA Large
2.7Fail
2.3Fail
Black BG
5.5AA
4.5AA Large
5.8AA
7.9AAA
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9A998A
888774
87877A
96968C
ABAB7F

Deuteranopia

A0A886
8D9372
87877B
94928F
AAA983

Tritanopia

C37E7C
A76D6C
867E7F
8B9395
A78C8E

Achromatopsia

848484
767676
858585
9A9A9A
A6A6A6

Shades & Tints Shades & Tints

#C85D98

Dark
Light

#AB5A7C

Dark
Light

#868876

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c85d98;
  --color-2: #ab5a7c;
  --color-3: #868876;
  --color-4: #89a784;
  --color-5: #a6b16f;
}

SCSS

$color-1: #c85d98;
$color-2: #ab5a7c;
$color-3: #868876;
$color-4: #89a784;
$color-5: #a6b16f;

TAILWIND

colors: {
  'brand-1': '#c85d98',
  'brand-2': '#ab5a7c',
  'brand-3': '#868876',
  'brand-4': '#89a784',
  'brand-5': '#a6b16f',
}

RGB Array

[200, 93, 152], [171, 90, 124], [134, 136, 118], [137, 167, 132], [166, 177, 111]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C85D98, #AB5A7C, #868876, #89A784, #A6B16F 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: #c85d98; --color-2: #ab5a7c; --color-3: #868876; --color-4: #89a784; --color-5: #a6b16f. 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