#FF8CE0 + #C5B1CC + #6CCCCC + #9CD9B7 + #E6E18E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FF8CE0

Mauve · Violet · Lilac Purple

HEX

#FF8CE0

RGB

rgb(255, 140, 224)

HSL

hsl(316, 100%, 77%)

HSB

hsb(316, 45%, 100%)

CMYK

cmyk(0%, 45%, 12%, 0%)

Oklch

oklch(79.0% 0.170 338.1)

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

#C5B1CC

Lilac · Silver · Lilac Purple

HEX

#C5B1CC

RGB

rgb(197, 177, 204)

HSL

hsl(284, 21%, 75%)

HSB

hsb(284, 13%, 80%)

CMYK

cmyk(3%, 13%, 0%, 20%)

Oklch

oklch(78.6% 0.044 317.3)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#6CCCCC

Sky Blue · MediumAquaMarine · Lake Green

HEX

#6CCCCC

RGB

rgb(108, 204, 204)

HSL

hsl(180, 48%, 61%)

HSB

hsb(180, 47%, 80%)

CMYK

cmyk(47%, 0%, 0%, 20%)

Oklch

oklch(78.7% 0.091 195.5)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#9CD9B7

Celadon · Silver · Apple Green

HEX

#9CD9B7

RGB

rgb(156, 217, 183)

HSL

hsl(147, 45%, 73%)

HSB

hsb(147, 28%, 85%)

CMYK

cmyk(28%, 0%, 16%, 15%)

Oklch

oklch(83.4% 0.079 159.7)

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

#E6E18E

Fresh Green · Khaki · Sunflower

HEX

#E6E18E

RGB

rgb(230, 225, 142)

HSL

hsl(57, 64%, 73%)

HSB

hsb(57, 38%, 90%)

CMYK

cmyk(0%, 2%, 38%, 10%)

Oklch

oklch(89.5% 0.104 105.3)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF8CE0

8AFFA9

Analogous

E48AFF

FF8CE0

FF8AA5

Triadic

FF8CE0

E0FF8A

8AE0FF

Split-Comp.

FF8CE0

A5FF8A

8AFFE4

Tetradic

FF8CE0

FFE48A

8AFFA9

8AA5FF

Contrast Matrix WCAG 2.1 Contrast

FF8CE0	C5B1CC	6CCCCC	9CD9B7	E6E18E
—	1.0 Fail	1.1 Fail	1.3 Fail	1.5 Fail
1.0 Fail	—	1.1 Fail	1.2 Fail	1.5 Fail
1.1 Fail	1.1 Fail	—	1.2 Fail	1.4 Fail
1.3 Fail	1.2 Fail	1.2 Fail	—	1.2 Fail
1.5 Fail	1.5 Fail	1.4 Fail	1.2 Fail	—

White BG

2.1Fail

2.0Fail

1.9Fail

1.6Fail

1.4Fail

Black BG

10.1AAA

10.5AAA

11.1AAA

13.0AAA

15.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CDCCCC

BCBCC5

9696CC

B6B7BF

E4E4A2

Deuteranopia

D4DDC7

BEBFC4

9089CC

B3AEC1

E4E5A7

Tritanopia

F9BCB8

C4C0BF

71CCCC

9FC6C7

E6B2B5

Achromatopsia

B8B8B8

BABABA

AFAFAF

C3C3C3

D9D9D9

Shades & Tints Shades & Tints

#FF8CE0

Dark

Light

#C5B1CC

Dark

Light

#6CCCCC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff8ce0;
  --color-2: #c5b1cc;
  --color-3: #6ccccc;
  --color-4: #9cd9b7;
  --color-5: #e6e18e;
}

SCSS

$color-1: #ff8ce0;
$color-2: #c5b1cc;
$color-3: #6ccccc;
$color-4: #9cd9b7;
$color-5: #e6e18e;

TAILWIND

colors: {
  'brand-1': '#ff8ce0',
  'brand-2': '#c5b1cc',
  'brand-3': '#6ccccc',
  'brand-4': '#9cd9b7',
  'brand-5': '#e6e18e',
}

RGB Array

[255, 140, 224], [197, 177, 204], [108, 204, 204], [156, 217, 183], [230, 225, 142]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF8CE0, #C5B1CC, #6CCCCC, #9CD9B7, #E6E18E 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: #ff8ce0; --color-2: #c5b1cc; --color-3: #6ccccc; --color-4: #9cd9b7; --color-5: #e6e18e. 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