← Back to Editor

#8AF078 · #C8D602 · #A8A8A8 · #B89E97 · #1E2233

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

#8AF078

Emerald · LightGreen · Apple Green

HEX
#8AF078
RGB
rgb(138, 240, 120)
HSL
hsl(111, 80%, 71%)
HSB
hsb(111, 50%, 94%)
CMYK
cmyk(43%, 0%, 50%, 6%)
Oklch
oklch(86.6% 0.184 140.7)

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

#C8D602

Autumn Sage · Gold · Honey Gold

HEX
#C8D602
RGB
rgb(200, 214, 2)
HSL
hsl(64, 98%, 42%)
HSB
hsb(64, 99%, 84%)
CMYK
cmyk(7%, 0%, 99%, 16%)
Oklch
oklch(83.7% 0.188 114.5)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#A8A8A8

Ash · DarkGray · Silver Sand

HEX
#A8A8A8
RGB
rgb(168, 168, 168)
HSL
hsl(0, 0%, 66%)
HSB
hsb(0, 0%, 66%)
CMYK
cmyk(0%, 0%, 0%, 34%)
Oklch
oklch(73.2% 0.000 89.9)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#B89E97

Peach Pink · DarkGray · Coral Red

HEX
#B89E97
RGB
rgb(184, 158, 151)
HSL
hsl(13, 19%, 66%)
HSB
hsb(13, 18%, 72%)
CMYK
cmyk(0%, 14%, 18%, 28%)
Oklch
oklch(72.0% 0.033 35.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#1E2233

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#1E2233
RGB
rgb(30, 34, 51)
HSL
hsl(229, 26%, 16%)
HSB
hsb(229, 41%, 20%)
CMYK
cmyk(41%, 33%, 0%, 80%)
Oklch
oklch(25.6% 0.033 273.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8AF078
DE7AF0

Analogous

C7F07A
8AF078
7AF0A3

Triadic

8AF078
7A8CF0
F07A8C

Split-Comp.

8AF078
A37AF0
F07AC7

Tetradic

8AF078
7AC7F0
DE7AF0
F0A37A

Contrast Matrix WCAG 2.1 Contrast

8AF078
C8D602
A8A8A8
B89E97
1E2233
—
1.1
Fail
1.7
Fail
1.8
Fail
11.1
AAA
1.1
Fail
—
1.5
Fail
1.6
Fail
9.8
AAA
1.7
Fail
1.5
Fail
—
1.1
Fail
6.6
AA
1.8
Fail
1.6
Fail
1.1
Fail
—
6.3
AA
11.1
AAA
9.8
AAA
6.6
AA
6.3
AA
—
White BG
1.4Fail
1.6Fail
2.4Fail
2.5Fail
15.8AAA
Black BG
14.8AAA
13.1AAA
8.8AAA
8.4AAA
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B795
CECE35
A8A8A8
ADAD99
20202F

Deuteranopia

B0A99C
CDCC42
A8A8A8
AEB099
201F2E

Tritanopia

8FACB1
C95E67
A8A8A8
B79A9A
1E2C2B

Achromatopsia

C4C4C4
BABABA
A8A8A8
A5A5A5
232323

Shades & Tints Shades & Tints

#8AF078

Dark
Light

#C8D602

Dark
Light

#A8A8A8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8af078;
  --color-2: #c8d602;
  --color-3: #a8a8a8;
  --color-4: #b89e97;
  --color-5: #1e2233;
}

SCSS

$color-1: #8af078;
$color-2: #c8d602;
$color-3: #a8a8a8;
$color-4: #b89e97;
$color-5: #1e2233;

TAILWIND

colors: {
  'brand-1': '#8af078',
  'brand-2': '#c8d602',
  'brand-3': '#a8a8a8',
  'brand-4': '#b89e97',
  'brand-5': '#1e2233',
}

RGB Array

[138, 240, 120], [200, 214, 2], [168, 168, 168], [184, 158, 151], [30, 34, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8AF078, #C8D602, #A8A8A8, #B89E97, #1E2233 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #8af078; --color-2: #c8d602; --color-3: #a8a8a8; --color-4: #b89e97; --color-5: #1e2233. 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. 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