← Back to Editor

#C0F59D · #B7CC98 · #AEA293 · #A4798E · #9B5089

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

#C0F59D

Emerald · LightGreen · Apple Green

HEX
#C0F59D
RGB
rgb(192, 245, 157)
HSL
hsl(96, 81%, 79%)
HSB
hsb(96, 36%, 96%)
CMYK
cmyk(22%, 0%, 36%, 4%)
Oklch
oklch(91.3% 0.127 133.6)

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

#B7CC98

Willow Green · Tan · Apple Green

HEX
#B7CC98
RGB
rgb(183, 204, 152)
HSL
hsl(84, 34%, 70%)
HSB
hsb(84, 25%, 80%)
CMYK
cmyk(10%, 0%, 25%, 20%)
Oklch
oklch(81.6% 0.074 125.9)

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

#AEA293

Ginger · DarkGray · Warm Sun

HEX
#AEA293
RGB
rgb(174, 162, 147)
HSL
hsl(33, 14%, 63%)
HSB
hsb(33, 16%, 68%)
CMYK
cmyk(0%, 7%, 16%, 32%)
Oklch
oklch(71.8% 0.025 73.5)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#A4798E

Dark Violet · Gray · Rose Pink

HEX
#A4798E
RGB
rgb(164, 121, 142)
HSL
hsl(331, 19%, 56%)
HSB
hsb(331, 26%, 64%)
CMYK
cmyk(0%, 26%, 13%, 36%)
Oklch
oklch(62.5% 0.061 348.2)

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

#9B5089

Rose Purple · Gray · Violet

HEX
#9B5089
RGB
rgb(155, 80, 137)
HSL
hsl(314, 32%, 46%)
HSB
hsb(314, 48%, 61%)
CMYK
cmyk(0%, 48%, 12%, 39%)
Oklch
oklch(54.1% 0.123 336.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C0F59D
D29EF5

Analogous

ECF59E
C0F59D
9EF5A7

Triadic

C0F59D
9EC1F5
F59EC1

Split-Comp.

C0F59D
A79EF5
F59EEC

Tetradic

C0F59D
9EECF5
D29EF5
F5A79E

Contrast Matrix WCAG 2.1 Contrast

C0F59D
B7CC98
AEA293
A4798E
9B5089
—
1.4
Fail
2.0
Fail
2.9
Fail
4.3
AA Large
1.4
Fail
—
1.4
Fail
2.1
Fail
3.1
AA Large
2.0
Fail
1.4
Fail
—
1.5
Fail
2.1
Fail
2.9
Fail
2.1
Fail
1.5
Fail
—
1.5
Fail
4.3
AA Large
3.1
AA Large
2.1
Fail
1.5
Fail
—
White BG
1.3Fail
1.7Fail
2.5Fail
3.7AA Large
5.4AA
Black BG
16.8AAA
12.1AAA
8.4AAA
5.7AA
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D7B2
C0C0A5
A9A997
919189
7B7A7B

Deuteranopia

D4D0B7
BFBDA8
AAAA98
949788
7F8578

Tritanopia

C3C3C7
B8AFB1
AD999A
A28584
97706E

Achromatopsia

DBDBDB
C0C0C0
A4A4A4
888888
6D6D6D

Shades & Tints Shades & Tints

#C0F59D

Dark
Light

#B7CC98

Dark
Light

#AEA293

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c0f59d;
  --color-2: #b7cc98;
  --color-3: #aea293;
  --color-4: #a4798e;
  --color-5: #9b5089;
}

SCSS

$color-1: #c0f59d;
$color-2: #b7cc98;
$color-3: #aea293;
$color-4: #a4798e;
$color-5: #9b5089;

TAILWIND

colors: {
  'brand-1': '#c0f59d',
  'brand-2': '#b7cc98',
  'brand-3': '#aea293',
  'brand-4': '#a4798e',
  'brand-5': '#9b5089',
}

RGB Array

[192, 245, 157], [183, 204, 152], [174, 162, 147], [164, 121, 142], [155, 80, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C0F59D, #B7CC98, #AEA293, #A4798E, #9B5089 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: #c0f59d; --color-2: #b7cc98; --color-3: #aea293; --color-4: #a4798e; --color-5: #9b5089. 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