#E1F1B4 + #CFE6BF + #B6DFCE + #C4A2C0 + #DF7CD1 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E1F1B4

Willow Green · Wheat · Mint Green

HEX

#E1F1B4

RGB

rgb(225, 241, 180)

HSL

hsl(76, 69%, 83%)

HSB

hsb(76, 25%, 95%)

CMYK

cmyk(7%, 0%, 25%, 5%)

Oklch

oklch(93.1% 0.081 119.9)

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

#CFE6BF

Celadon · LightGray · Mint Green

HEX

#CFE6BF

RGB

rgb(207, 230, 191)

HSL

hsl(95, 44%, 83%)

HSB

hsb(95, 17%, 90%)

CMYK

cmyk(10%, 0%, 17%, 10%)

Oklch

oklch(89.8% 0.058 132.5)

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

#B6DFCE

Jade · LightBlue · Apple Green

HEX

#B6DFCE

RGB

rgb(182, 223, 206)

HSL

hsl(155, 39%, 79%)

HSB

hsb(155, 18%, 87%)

CMYK

cmyk(18%, 0%, 8%, 13%)

Oklch

oklch(87.0% 0.049 168.1)

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

#C4A2C0

Mauve · Silver · Lilac Purple

HEX

#C4A2C0

RGB

rgb(196, 162, 192)

HSL

hsl(307, 22%, 70%)

HSB

hsb(307, 17%, 77%)

CMYK

cmyk(0%, 17%, 2%, 23%)

Oklch

oklch(75.2% 0.057 330.0)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#DF7CD1

Mauve · Orchid · Lilac Purple

HEX

#DF7CD1

RGB

rgb(223, 124, 209)

HSL

hsl(308, 61%, 68%)

HSB

hsb(308, 44%, 87%)

CMYK

cmyk(0%, 44%, 6%, 13%)

Oklch

oklch(72.3% 0.161 332.5)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1F1B4

C6B6F2

Analogous

F2E4B6

E1F1B4

C4F2B6

Triadic

E1F1B4

B6E2F2

F2B6E2

Split-Comp.

E1F1B4

B6C4F2

E4B6F2

Tetradic

E1F1B4

B6F2E4

C6B6F2

F2B6C4

Contrast Matrix WCAG 2.1 Contrast

E1F1B4	CFE6BF	B6DFCE	C4A2C0	DF7CD1
—	1.1 Fail	1.2 Fail	1.9 Fail	2.2 Fail
1.1 Fail	—	1.1 Fail	1.7 Fail	2.0 Fail
1.2 Fail	1.1 Fail	—	1.6 Fail	1.8 Fail
1.9 Fail	1.7 Fail	1.6 Fail	—	1.2 Fail
2.2 Fail	2.0 Fail	1.8 Fail	1.2 Fail	—

White BG

1.2Fail

1.3Fail

1.5Fail

2.3Fail

2.6Fail

Black BG

17.4AAA

15.7AAA

14.4AAA

9.3AAA

7.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8C3

D9D9C8

C8C8D2

B5B5B9

B4B3BC

Deuteranopia

E7E6C6

D8D6CB

C5C2D3

B7BAB7

BAC1B7

Tritanopia

E2CED1

D0D0D2

B8D5D6

C2B3B2

DAACA9

Achromatopsia

E5E5E5

DBDBDB

D1D1D1

B0B0B0

A3A3A3

Shades & Tints Shades & Tints

#E1F1B4

Dark

Light

#CFE6BF

Dark

Light

#B6DFCE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1f1b4;
  --color-2: #cfe6bf;
  --color-3: #b6dfce;
  --color-4: #c4a2c0;
  --color-5: #df7cd1;
}

SCSS

$color-1: #e1f1b4;
$color-2: #cfe6bf;
$color-3: #b6dfce;
$color-4: #c4a2c0;
$color-5: #df7cd1;

TAILWIND

colors: {
  'brand-1': '#e1f1b4',
  'brand-2': '#cfe6bf',
  'brand-3': '#b6dfce',
  'brand-4': '#c4a2c0',
  'brand-5': '#df7cd1',
}

RGB Array

[225, 241, 180], [207, 230, 191], [182, 223, 206], [196, 162, 192], [223, 124, 209]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E1F1B4, #CFE6BF, #B6DFCE, #C4A2C0, #DF7CD1 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: #e1f1b4; --color-2: #cfe6bf; --color-3: #b6dfce; --color-4: #c4a2c0; --color-5: #df7cd1. 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