← Back to Editor

#CFC070 · #A3AB6A · #7B8F63 · #5C705D · #515657

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 Library

Color Details Color Details

#CFC070

Fresh Green · BurlyWood · Sunflower

HEX
#CFC070
RGB
rgb(207, 192, 112)
HSL
hsl(51, 50%, 63%)
HSB
hsb(51, 46%, 81%)
CMYK
cmyk(0%, 7%, 46%, 19%)
Oklch
oklch(80.3% 0.102 98.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#A3AB6A

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A3AB6A
RGB
rgb(163, 171, 106)
HSL
hsl(67, 28%, 54%)
HSB
hsb(67, 38%, 67%)
CMYK
cmyk(5%, 0%, 38%, 33%)
Oklch
oklch(71.9% 0.088 114.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#7B8F63

Grass Green · Gray · Olive Green

HEX
#7B8F63
RGB
rgb(123, 143, 99)
HSL
hsl(87, 18%, 47%)
HSB
hsb(87, 31%, 56%)
CMYK
cmyk(14%, 0%, 31%, 44%)
Oklch
oklch(62.2% 0.067 128.1)

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

#5C705D

Celadon · DimGray · Forest Green

HEX
#5C705D
RGB
rgb(92, 112, 93)
HSL
hsl(123, 10%, 40%)
HSB
hsb(123, 18%, 44%)
CMYK
cmyk(18%, 0%, 17%, 56%)
Oklch
oklch(52.3% 0.038 146.3)

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

#515657

Ink Gray · DimGray · Charcoal

HEX
#515657
RGB
rgb(81, 86, 87)
HSL
hsl(190, 4%, 33%)
HSB
hsb(190, 7%, 34%)
CMYK
cmyk(7%, 1%, 0%, 66%)
Oklch
oklch(44.9% 0.007 211.0)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CFC070
7180D0

Analogous

D09271
CFC070
AFD071

Triadic

CFC070
71D0C2
C271D0

Split-Comp.

CFC070
71AFD0
9271D0

Tetradic

CFC070
71D092
7180D0
D071AF

Contrast Matrix WCAG 2.1 Contrast

CFC070
A3AB6A
7B8F63
5C705D
515657
—
1.3
Fail
1.9
Fail
2.9
Fail
4.1
AA Large
1.3
Fail
—
1.4
Fail
2.2
Fail
3.0
AA Large
1.9
Fail
1.4
Fail
—
1.5
Fail
2.1
Fail
2.9
Fail
2.2
Fail
1.5
Fail
—
1.4
Fail
4.1
AA Large
3.0
AA Large
2.1
Fail
1.4
Fail
—
White BG
1.8Fail
2.4Fail
3.5AA Large
5.3AA
7.5AAA
Black BG
11.4AAA
8.6AAA
6.0AA
3.9AA Large
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C883
A6A77A
84846E
656562
535357

Deuteranopia

C9CA88
A6A57D
838170
646263
535357

Tritanopia

CE9396
A38689
7C7678
5D6566
515757

Achromatopsia

BBBBBB
A1A1A1
848484
686868
555555

Shades & Tints Shades & Tints

#CFC070

Dark
Light

#A3AB6A

Dark
Light

#7B8F63

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cfc070;
  --color-2: #a3ab6a;
  --color-3: #7b8f63;
  --color-4: #5c705d;
  --color-5: #515657;
}

SCSS

$color-1: #cfc070;
$color-2: #a3ab6a;
$color-3: #7b8f63;
$color-4: #5c705d;
$color-5: #515657;

TAILWIND

colors: {
  'brand-1': '#cfc070',
  'brand-2': '#a3ab6a',
  'brand-3': '#7b8f63',
  'brand-4': '#5c705d',
  'brand-5': '#515657',
}

RGB Array

[207, 192, 112], [163, 171, 106], [123, 143, 99], [92, 112, 93], [81, 86, 87]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CFC070, #A3AB6A, #7B8F63, #5C705D, #515657 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: #cfc070; --color-2: #a3ab6a; --color-3: #7b8f63; --color-4: #5c705d; --color-5: #515657. 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