← Back to Editor

#CBE092 · #ABCC8D · #81AD7F · #648268 · #52665B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatile

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#CBE092

Willow Green · Khaki · Apple Green

HEX
#CBE092
RGB
rgb(203, 224, 146)
HSL
hsl(76, 56%, 73%)
HSB
hsb(76, 35%, 88%)
CMYK
cmyk(9%, 0%, 35%, 12%)
Oklch
oklch(87.3% 0.104 120.8)

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

#ABCC8D

Celadon · DarkSeaGreen · Apple Green

HEX
#ABCC8D
RGB
rgb(171, 204, 141)
HSL
hsl(91, 38%, 68%)
HSB
hsb(91, 31%, 80%)
CMYK
cmyk(16%, 0%, 31%, 20%)
Oklch
oklch(80.5% 0.092 130.7)

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

#81AD7F

Celadon · DarkSeaGreen · Olive Green

HEX
#81AD7F
RGB
rgb(129, 173, 127)
HSL
hsl(117, 22%, 59%)
HSB
hsb(117, 27%, 68%)
CMYK
cmyk(25%, 0%, 27%, 32%)
Oklch
oklch(70.3% 0.081 143.6)

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

#648268

Celadon · DimGray · Olive Green

HEX
#648268
RGB
rgb(100, 130, 104)
HSL
hsl(128, 13%, 45%)
HSB
hsb(128, 23%, 51%)
CMYK
cmyk(23%, 0%, 20%, 49%)
Oklch
oklch(57.6% 0.052 148.5)

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

#52665B

Celadon · DimGray · Forest Green

HEX
#52665B
RGB
rgb(82, 102, 91)
HSL
hsl(147, 11%, 36%)
HSB
hsb(147, 20%, 40%)
CMYK
cmyk(20%, 0%, 11%, 60%)
Oklch
oklch(49.0% 0.030 161.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBE092
A894E1

Analogous

E1CF94
CBE092
A6E194

Triadic

CBE092
94CCE1
E194CC

Split-Comp.

CBE092
94A6E1
CF94E1

Tetradic

CBE092
94E1CF
A894E1
E194A6

Contrast Matrix WCAG 2.1 Contrast

CBE092
ABCC8D
81AD7F
648268
52665B
—
1.2
Fail
1.8
Fail
3.0
Fail
4.3
AA Large
1.2
Fail
—
1.4
Fail
2.4
Fail
3.4
AA Large
1.8
Fail
1.4
Fail
—
1.7
Fail
2.4
Fail
3.0
Fail
2.4
Fail
1.7
Fail
—
1.4
Fail
4.3
AA Large
3.4
AA Large
2.4
Fail
1.4
Fail
—
White BG
1.4Fail
1.8Fail
2.6Fail
4.3AA Large
6.2AA
Black BG
14.6AAA
11.8AAA
8.2AAA
4.9AA
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D4D4A5
B9BA9C
94948A
71716E
5B5B5E

Deuteranopia

D3D1A9
B7B5A0
928E8D
6F6D70
5A585E

Tritanopia

CCB4B7
ADA8AB
839395
667374
536060

Achromatopsia

D1D1D1
BBBBBB
9B9B9B
767676
5F5F5F

Shades & Tints Shades & Tints

#CBE092

Dark
Light

#ABCC8D

Dark
Light

#81AD7F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbe092;
  --color-2: #abcc8d;
  --color-3: #81ad7f;
  --color-4: #648268;
  --color-5: #52665b;
}

SCSS

$color-1: #cbe092;
$color-2: #abcc8d;
$color-3: #81ad7f;
$color-4: #648268;
$color-5: #52665b;

TAILWIND

colors: {
  'brand-1': '#cbe092',
  'brand-2': '#abcc8d',
  'brand-3': '#81ad7f',
  'brand-4': '#648268',
  'brand-5': '#52665b',
}

RGB Array

[203, 224, 146], [171, 204, 141], [129, 173, 127], [100, 130, 104], [82, 102, 91]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CBE092, #ABCC8D, #81AD7F, #648268, #52665B 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: #cbe092; --color-2: #abcc8d; --color-3: #81ad7f; --color-4: #648268; --color-5: #52665b. 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