← Back to Editor

#6CA67A · #8CB379 · #ACBF54 · #CCCC00 · #0A0F0F

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#6CA67A

Celadon · CadetBlue · Olive Green

HEX
#6CA67A
RGB
rgb(108, 166, 122)
HSL
hsl(134, 25%, 54%)
HSB
hsb(134, 35%, 65%)
CMYK
cmyk(35%, 0%, 27%, 35%)
Oklch
oklch(67.3% 0.089 151.1)

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

#8CB379

Celadon · DarkSeaGreen · Olive Green

HEX
#8CB379
RGB
rgb(140, 179, 121)
HSL
hsl(100, 28%, 59%)
HSB
hsb(100, 32%, 70%)
CMYK
cmyk(22%, 0%, 32%, 30%)
Oklch
oklch(72.3% 0.091 135.7)

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

#ACBF54

Grass Green · DarkSeaGreen · Olive Green

HEX
#ACBF54
RGB
rgb(172, 191, 84)
HSL
hsl(71, 46%, 54%)
HSB
hsb(71, 56%, 75%)
CMYK
cmyk(10%, 0%, 56%, 25%)
Oklch
oklch(76.8% 0.134 118.1)

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

#CCCC00

Autumn Sage · Gold · Honey Gold

HEX
#CCCC00
RGB
rgb(204, 204, 0)
HSL
hsl(60, 100%, 40%)
HSB
hsb(60, 100%, 80%)
CMYK
cmyk(0%, 0%, 100%, 20%)
Oklch
oklch(81.8% 0.178 109.8)

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

#0A0F0F

Slate Blue · Black · Peacock Green

HEX
#0A0F0F
RGB
rgb(10, 15, 15)
HSL
hsl(180, 20%, 5%)
HSB
hsb(180, 33%, 6%)
CMYK
cmyk(33%, 0%, 0%, 94%)
Oklch
oklch(16.3% 0.008 196.4)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6CA67A
A76C99

Analogous

7CA76C
6CA67A
6CA797

Triadic

6CA67A
7A6CA7
A77A6C

Split-Comp.

6CA67A
976CA7
A76C7C

Tetradic

6CA67A
6C7CA7
A76C99
A7976C

Contrast Matrix WCAG 2.1 Contrast

6CA67A
8CB379
ACBF54
CCCC00
0A0F0F
—
1.2
Fail
1.4
Fail
1.7
Fail
6.8
AA
1.2
Fail
—
1.2
Fail
1.4
Fail
8.1
AAA
1.4
Fail
1.2
Fail
—
1.2
Fail
9.5
AAA
1.7
Fail
1.4
Fail
1.2
Fail
—
11.2
AAA
6.8
AA
8.1
AAA
9.5
AAA
11.2
AAA
—
White BG
2.8Fail
2.4Fail
2.0Fail
1.7Fail
19.3AAA
Black BG
7.4AAA
8.8AAA
10.3AAA
12.2AAA
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

858685
9D9D87
B4B46E
CCCC31
0C0C0F

Deuteranopia

827D87
9B988A
B3B274
CCCC3D
0C0C0F

Tritanopia

6F8D8F
8E9295
AD8287
CC5861
0A0F0F

Achromatopsia

909090
A1A1A1
ADADAD
B5B5B5
0E0E0E

Shades & Tints Shades & Tints

#6CA67A

Dark
Light

#8CB379

Dark
Light

#ACBF54

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6ca67a;
  --color-2: #8cb379;
  --color-3: #acbf54;
  --color-4: #cccc00;
  --color-5: #0a0f0f;
}

SCSS

$color-1: #6ca67a;
$color-2: #8cb379;
$color-3: #acbf54;
$color-4: #cccc00;
$color-5: #0a0f0f;

TAILWIND

colors: {
  'brand-1': '#6ca67a',
  'brand-2': '#8cb379',
  'brand-3': '#acbf54',
  'brand-4': '#cccc00',
  'brand-5': '#0a0f0f',
}

RGB Array

[108, 166, 122], [140, 179, 121], [172, 191, 84], [204, 204, 0], [10, 15, 15]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6CA67A, #8CB379, #ACBF54, #CCCC00, #0A0F0F 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: #6ca67a; --color-2: #8cb379; --color-3: #acbf54; --color-4: #cccc00; --color-5: #0a0f0f. 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