#E2E8CE + #C3D9C9 + #A6A59D + #C9B3A9 + #FFA6A6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E2E8CE

Willow Green · LightGray · Mint Green

HEX

#E2E8CE

RGB

rgb(226, 232, 206)

HSL

hsl(74, 36%, 86%)

HSB

hsb(74, 11%, 91%)

CMYK

cmyk(3%, 0%, 11%, 9%)

Oklch

oklch(91.9% 0.035 117.7)

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

#C3D9C9

Celadon · LightGray · Mint Green

HEX

#C3D9C9

RGB

rgb(195, 217, 201)

HSL

hsl(136, 22%, 81%)

HSB

hsb(136, 10%, 85%)

CMYK

cmyk(10%, 0%, 7%, 15%)

Oklch

oklch(86.4% 0.032 154.1)

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

#A6A59D

Ash · DarkGray · Silver Sand

HEX

#A6A59D

RGB

rgb(166, 165, 157)

HSL

hsl(53, 5%, 63%)

HSB

hsb(53, 5%, 65%)

CMYK

cmyk(0%, 1%, 5%, 35%)

Oklch

oklch(72.0% 0.011 100.9)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#C9B3A9

Apricot · Silver · Warm Sun

HEX

#C9B3A9

RGB

rgb(201, 179, 169)

HSL

hsl(19, 23%, 73%)

HSB

hsb(19, 16%, 79%)

CMYK

cmyk(0%, 11%, 16%, 21%)

Oklch

oklch(78.3% 0.029 46.0)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#FFA6A6

Peach Pink · LightPink · Cherry Blossom

HEX

#FFA6A6

RGB

rgb(255, 166, 166)

HSL

hsl(0, 100%, 83%)

HSB

hsb(0, 35%, 100%)

CMYK

cmyk(0%, 35%, 35%, 0%)

Oklch

oklch(81.3% 0.106 19.6)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E2E8CE

D4CEE8

Analogous

E8E1CE

E2E8CE

D5E8CE

Triadic

E2E8CE

CEE2E8

E8CEE2

Split-Comp.

E2E8CE

CED5E8

E1CEE8

Tetradic

E2E8CE

CEE8E1

D4CEE8

E8CED5

Contrast Matrix WCAG 2.1 Contrast

E2E8CE	C3D9C9	A6A59D	C9B3A9	FFA6A6
—	1.2 Fail	2.0 Fail	1.6 Fail	1.5 Fail
1.2 Fail	—	1.7 Fail	1.3 Fail	1.3 Fail
2.0 Fail	1.7 Fail	—	1.2 Fail	1.3 Fail
1.6 Fail	1.3 Fail	1.2 Fail	—	1.1 Fail
1.5 Fail	1.3 Fail	1.3 Fail	1.1 Fail	—

White BG

1.3Fail

1.5Fail

2.5Fail

2.0Fail

1.9Fail

Black BG

16.7AAA

14.1AAA

8.5AAA

10.5AAA

11.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E5D4

CDCDCD

A6A69F

BFBFAB

D8D8A6

Deuteranopia

E4E4D6

CBCACE

A6A69F

C1C2AC

DEE4A6

Tritanopia

E2D9DA

C4D0D1

A6A0A1

C8ADAE

FBA6A6

Achromatopsia

E3E3E3

D1D1D1

A4A4A4

B8B8B8

C1C1C1

Shades & Tints Shades & Tints

#E2E8CE

Dark

Light

#C3D9C9

Dark

Light

#A6A59D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e2e8ce;
  --color-2: #c3d9c9;
  --color-3: #a6a59d;
  --color-4: #c9b3a9;
  --color-5: #ffa6a6;
}

SCSS

$color-1: #e2e8ce;
$color-2: #c3d9c9;
$color-3: #a6a59d;
$color-4: #c9b3a9;
$color-5: #ffa6a6;

TAILWIND

colors: {
  'brand-1': '#e2e8ce',
  'brand-2': '#c3d9c9',
  'brand-3': '#a6a59d',
  'brand-4': '#c9b3a9',
  'brand-5': '#ffa6a6',
}

RGB Array

[226, 232, 206], [195, 217, 201], [166, 165, 157], [201, 179, 169], [255, 166, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E2E8CE, #C3D9C9, #A6A59D, #C9B3A9, #FFA6A6 is ideal for: health products, baby brands, fresh-style blogs. 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: #e2e8ce; --color-2: #c3d9c9; --color-3: #a6a59d; --color-4: #c9b3a9; --color-5: #ffa6a6. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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