← Back to Editor

#65E1BC · #80C4A8 · #ACC480 · #C4B580 · #C9A761

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

#65E1BC

Jade · MediumAquaMarine · Lake Green

HEX
#65E1BC
RGB
rgb(101, 225, 188)
HSL
hsl(162, 67%, 64%)
HSB
hsb(162, 55%, 88%)
CMYK
cmyk(55%, 0%, 16%, 12%)
Oklch
oklch(82.9% 0.124 170.9)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#80C4A8

Jade · MediumAquaMarine · Apple Green

HEX
#80C4A8
RGB
rgb(128, 196, 168)
HSL
hsl(155, 37%, 64%)
HSB
hsb(155, 35%, 77%)
CMYK
cmyk(35%, 0%, 14%, 23%)
Oklch
oklch(76.7% 0.080 166.5)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#ACC480

Willow Green · DarkSeaGreen · Apple Green

HEX
#ACC480
RGB
rgb(172, 196, 128)
HSL
hsl(81, 37%, 64%)
HSB
hsb(81, 35%, 77%)
CMYK
cmyk(12%, 0%, 35%, 23%)
Oklch
oklch(78.6% 0.095 124.3)

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

#C4B580

Ginger · Tan · Sunflower

HEX
#C4B580
RGB
rgb(196, 181, 128)
HSL
hsl(47, 37%, 64%)
HSB
hsb(47, 35%, 77%)
CMYK
cmyk(0%, 8%, 35%, 23%)
Oklch
oklch(77.3% 0.072 94.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#C9A761

Ginger · SandyBrown · Sunflower

HEX
#C9A761
RGB
rgb(201, 167, 97)
HSL
hsl(40, 49%, 58%)
HSB
hsb(40, 52%, 79%)
CMYK
cmyk(0%, 17%, 52%, 21%)
Oklch
oklch(74.4% 0.097 84.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

65E1BC
E1668B

Analogous

66E17E
65E1BC
66C8E1

Triadic

65E1BC
BC66E1
E1BC66

Split-Comp.

65E1BC
E166C8
E17E66

Tetradic

65E1BC
7E66E1
E1668B
C8E166

Contrast Matrix WCAG 2.1 Contrast

65E1BC
80C4A8
ACC480
C4B580
C9A761
—
1.3
Fail
1.2
Fail
1.3
Fail
1.4
Fail
1.3
Fail
—
1.1
Fail
1.0
Fail
1.1
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.3
Fail
1.0
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
1.1
Fail
1.2
Fail
1.1
Fail
—
White BG
1.6Fail
2.0Fail
1.9Fail
2.0Fail
2.3Fail
Black BG
13.0AAA
10.4AAA
11.0AAA
10.3AAA
9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9CC5
9D9EAF
B6B790
BEBD8D
BABA72

Deuteranopia

948AC7
9A94B0
B5B394
BEC090
BCBF76

Tritanopia

6BCCCE
83B4B5
AD9DA0
C39799
C77F82

Achromatopsia

B8B8B8
ACACAC
B5B5B5
B3B3B3
A9A9A9

Shades & Tints Shades & Tints

#65E1BC

Dark
Light

#80C4A8

Dark
Light

#ACC480

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #65e1bc;
  --color-2: #80c4a8;
  --color-3: #acc480;
  --color-4: #c4b580;
  --color-5: #c9a761;
}

SCSS

$color-1: #65e1bc;
$color-2: #80c4a8;
$color-3: #acc480;
$color-4: #c4b580;
$color-5: #c9a761;

TAILWIND

colors: {
  'brand-1': '#65e1bc',
  'brand-2': '#80c4a8',
  'brand-3': '#acc480',
  'brand-4': '#c4b580',
  'brand-5': '#c9a761',
}

RGB Array

[101, 225, 188], [128, 196, 168], [172, 196, 128], [196, 181, 128], [201, 167, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #65E1BC, #80C4A8, #ACC480, #C4B580, #C9A761 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: #65e1bc; --color-2: #80c4a8; --color-3: #acc480; --color-4: #c4b580; --color-5: #c9a761. 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