← Back to Editor

#E6A3A3 · #D6D48C · #9ECF95 · #5AAD9E · #65828A

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

#E6A3A3

Peach Pink · Tan · Coral Red

HEX
#E6A3A3
RGB
rgb(230, 163, 163)
HSL
hsl(0, 57%, 77%)
HSB
hsb(0, 29%, 90%)
CMYK
cmyk(0%, 29%, 29%, 10%)
Oklch
oklch(78.0% 0.080 19.0)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#D6D48C

Fresh Green · BurlyWood · Sunflower

HEX
#D6D48C
RGB
rgb(214, 212, 140)
HSL
hsl(58, 47%, 69%)
HSB
hsb(58, 35%, 84%)
CMYK
cmyk(0%, 1%, 35%, 16%)
Oklch
oklch(85.5% 0.093 106.8)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#9ECF95

Celadon · DarkSeaGreen · Apple Green

HEX
#9ECF95
RGB
rgb(158, 207, 149)
HSL
hsl(111, 38%, 70%)
HSB
hsb(111, 28%, 81%)
CMYK
cmyk(24%, 0%, 28%, 19%)
Oklch
oklch(80.5% 0.095 140.7)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#5AAD9E

Mineral Blue · CadetBlue · Lake Green

HEX
#5AAD9E
RGB
rgb(90, 173, 158)
HSL
hsl(169, 34%, 52%)
HSB
hsb(169, 48%, 68%)
CMYK
cmyk(48%, 0%, 9%, 32%)
Oklch
oklch(69.1% 0.085 180.5)

TraditionalMineral Blue」· PaintLake Green」· Creative Blush Sunrise

#65828A

Slate Blue · SlateGray · Mint Ice

HEX
#65828A
RGB
rgb(101, 130, 138)
HSL
hsl(193, 15%, 47%)
HSB
hsb(193, 27%, 54%)
CMYK
cmyk(27%, 6%, 0%, 46%)
Oklch
oklch(58.7% 0.035 216.5)

TraditionalSlate Blue」· PaintMint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E6A3A3
A3E6E6

Analogous

E6A3C4
E6A3A3
E6C4A3

Triadic

E6A3A3
A3E6A3
A3A3E6

Split-Comp.

E6A3A3
A3E6C4
A3C4E6

Tetradic

E6A3A3
C4E6A3
A3E6E6
C4A3E6

Contrast Matrix WCAG 2.1 Contrast

E6A3A3
D6D48C
9ECF95
5AAD9E
65828A
1.3
Fail
1.2
Fail
1.3
Fail
2.0
Fail
1.3
Fail
1.2
Fail
1.7
Fail
2.7
Fail
1.2
Fail
1.2
Fail
1.5
Fail
2.3
Fail
1.3
Fail
1.7
Fail
1.5
Fail
1.5
Fail
2.0
Fail
2.7
Fail
2.3
Fail
1.5
Fail
White BG
2.1Fail
1.5Fail
1.8Fail
2.7Fail
4.1AA Large
Black BG
10.1AAA
13.7AAA
11.8AAA
7.9AAA
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C8A3
D5D59D
B3B4A3
7E7FA2
727288

Deuteranopia

CDD2A3
D5D5A2
B0ADA6
7973A3
706E88

Tritanopia

E3A3A3
D6ABAE
A0AEB1
5EA4A5
668786

Achromatopsia

B7B7B7
CCCCCC
BABABA
929292
7A7A7A

Shades & Tints Shades & Tints

#E6A3A3

Dark
Light

#D6D48C

Dark
Light

#9ECF95

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e6a3a3;
  --color-2: #d6d48c;
  --color-3: #9ecf95;
  --color-4: #5aad9e;
  --color-5: #65828a;
}

SCSS

$color-1: #e6a3a3;
$color-2: #d6d48c;
$color-3: #9ecf95;
$color-4: #5aad9e;
$color-5: #65828a;

TAILWIND

colors: {
  'brand-1': '#e6a3a3',
  'brand-2': '#d6d48c',
  'brand-3': '#9ecf95',
  'brand-4': '#5aad9e',
  'brand-5': '#65828a',
}

RGB Array

[230, 163, 163], [214, 212, 140], [158, 207, 149], [90, 173, 158], [101, 130, 138]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E6A3A3, #D6D48C, #9ECF95, #5AAD9E, #65828A 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: #e6a3a3; --color-2: #d6d48c; --color-3: #9ecf95; --color-4: #5aad9e; --color-5: #65828a. 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