← Back to Editor

#E1E18B · #CDD6A1 · #91C2AC · #6BB8B0 · #55AA95

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 Library

Color Details Color Details

#E1E18B

Fresh Green · Khaki · Sunflower

HEX
#E1E18B
RGB
rgb(225, 225, 139)
HSL
hsl(60, 59%, 71%)
HSB
hsb(60, 38%, 88%)
CMYK
cmyk(0%, 0%, 38%, 12%)
Oklch
oklch(89.1% 0.108 108.4)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#CDD6A1

Willow Green · Silver · Apple Green

HEX
#CDD6A1
RGB
rgb(205, 214, 161)
HSL
hsl(70, 39%, 74%)
HSB
hsb(70, 25%, 84%)
CMYK
cmyk(4%, 0%, 25%, 16%)
Oklch
oklch(85.6% 0.071 115.8)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#91C2AC

Jade · DarkSeaGreen · Apple Green

HEX
#91C2AC
RGB
rgb(145, 194, 172)
HSL
hsl(153, 29%, 66%)
HSB
hsb(153, 25%, 76%)
CMYK
cmyk(25%, 0%, 11%, 24%)
Oklch
oklch(77.3% 0.060 165.5)

TraditionalJade」· PaintApple Green」· Creative Arctic Pool

#6BB8B0

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#6BB8B0
RGB
rgb(107, 184, 176)
HSL
hsl(174, 35%, 57%)
HSB
hsb(174, 42%, 72%)
CMYK
cmyk(42%, 0%, 4%, 28%)
Oklch
oklch(73.1% 0.078 187.1)

TraditionalMineral Blue」· PaintLake Green」· Creative Blush Sunrise

#55AA95

Mineral Blue · CadetBlue · Mint Ice

HEX
#55AA95
RGB
rgb(85, 170, 149)
HSL
hsl(165, 33%, 50%)
HSB
hsb(165, 50%, 67%)
CMYK
cmyk(50%, 0%, 12%, 33%)
Oklch
oklch(67.9% 0.089 175.3)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1E18B
8989E1

Analogous

E1B589
E1E18B
B5E189

Triadic

E1E18B
89E1E1
E189E1

Split-Comp.

E1E18B
89B5E1
B589E1

Tetradic

E1E18B
89E1B5
8989E1
E189B5

Contrast Matrix WCAG 2.1 Contrast

E1E18B
CDD6A1
91C2AC
6BB8B0
55AA95
1.1
Fail
1.5
Fail
1.7
Fail
2.0
Fail
1.1
Fail
1.3
Fail
1.5
Fail
1.8
Fail
1.5
Fail
1.3
Fail
1.2
Fail
1.4
Fail
1.7
Fail
1.5
Fail
1.2
Fail
1.2
Fail
2.0
Fail
1.8
Fail
1.4
Fail
1.2
Fail
White BG
1.4Fail
1.5Fail
2.0Fail
2.3Fail
2.8Fail
Black BG
15.3AAA
13.7AAA
10.5AAA
9.1AAA
7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E1E1A0
D1D1AE
A6A7B1
8C8DB2
7A7B9A

Deuteranopia

E1E1A5
D0D0B1
A3A0B3
8882B2
756F9B

Tritanopia

E1B0B4
CDB8BA
93B6B6
6FB3B4
599E9F

Achromatopsia

D7D7D7
CDCDCD
B1B1B1
A0A0A0
8E8E8E

Shades & Tints Shades & Tints

#E1E18B

Dark
Light

#CDD6A1

Dark
Light

#91C2AC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1e18b;
  --color-2: #cdd6a1;
  --color-3: #91c2ac;
  --color-4: #6bb8b0;
  --color-5: #55aa95;
}

SCSS

$color-1: #e1e18b;
$color-2: #cdd6a1;
$color-3: #91c2ac;
$color-4: #6bb8b0;
$color-5: #55aa95;

TAILWIND

colors: {
  'brand-1': '#e1e18b',
  'brand-2': '#cdd6a1',
  'brand-3': '#91c2ac',
  'brand-4': '#6bb8b0',
  'brand-5': '#55aa95',
}

RGB Array

[225, 225, 139], [205, 214, 161], [145, 194, 172], [107, 184, 176], [85, 170, 149]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E1E18B, #CDD6A1, #91C2AC, #6BB8B0, #55AA95 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: #e1e18b; --color-2: #cdd6a1; --color-3: #91c2ac; --color-4: #6bb8b0; --color-5: #55aa95. 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