#93C4B0 + #B0C3BB + #CCC6C8 + #EBBCCD + #FFC9EC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#93C4B0

Jade · DarkSeaGreen · Apple Green

HEX

#93C4B0

RGB

rgb(147, 196, 176)

HSL

hsl(156, 29%, 67%)

HSB

hsb(156, 25%, 77%)

CMYK

cmyk(25%, 0%, 10%, 23%)

Oklch

oklch(78.0% 0.059 167.8)

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

#B0C3BB

Jade · Silver · Apple Green

HEX

#B0C3BB

RGB

rgb(176, 195, 187)

HSL

hsl(155, 14%, 73%)

HSB

hsb(155, 10%, 76%)

CMYK

cmyk(10%, 0%, 4%, 24%)

Oklch

oklch(80.0% 0.024 168.6)

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

#CCC6C8

Silver Gray · Silver · Pearl Gray

HEX

#CCC6C8

RGB

rgb(204, 198, 200)

HSL

hsl(340, 6%, 79%)

HSB

hsb(340, 3%, 80%)

CMYK

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

Oklch

oklch(83.2% 0.007 354.8)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#EBBCCD

Rouge · Pink · Cherry Blossom

HEX

#EBBCCD

RGB

rgb(235, 188, 205)

HSL

hsl(338, 54%, 83%)

HSB

hsb(338, 20%, 92%)

CMYK

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

Oklch

oklch(84.2% 0.058 354.8)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#FFC9EC

Mauve · Pink · Cherry Blossom

HEX

#FFC9EC

RGB

rgb(255, 201, 236)

HSL

hsl(321, 100%, 89%)

HSB

hsb(321, 21%, 100%)

CMYK

cmyk(0%, 21%, 7%, 0%)

Oklch

oklch(89.4% 0.076 339.7)

Traditional「Mauve」· Paint「Cherry Blossom」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

93C4B0

C392A6

Analogous

92C397

93C4B0

92BEC3

Triadic

93C4B0

B092C3

C3B092

Split-Comp.

93C4B0

C392BE

C39792

Tetradic

93C4B0

9792C3

C392A6

BEC392

Contrast Matrix WCAG 2.1 Contrast

93C4B0	B0C3BB	CCC6C8	EBBCCD	FFC9EC
—	1.1 Fail	1.2 Fail	1.2 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	1.1 Fail	1.3 Fail
1.2 Fail	1.1 Fail	—	1.0 Fail	1.2 Fail
1.2 Fail	1.1 Fail	1.0 Fail	—	1.2 Fail
1.4 Fail	1.3 Fail	1.2 Fail	1.2 Fail	—

White BG

2.0Fail

1.8Fail

1.7Fail

1.4Fail

Black BG

10.8AAA

11.4AAA

12.5AAA

12.6AAA

14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A8A9B5

B8B8BD

C9C9C8

D7D6C9

E8E7E4

Deuteranopia

A5A2B6

B7B6BD

CACAC7

D9DDC8

EBEFE2

Tritanopia

95B9BA

B1BEBF

CCC7C7

E9C6C5

FCDDDB

Achromatopsia

B3B3B3

BCBCBC

C8C8C8

CCCCCC

DDDDDD

Shades & Tints Shades & Tints

#93C4B0

Dark

Light

#B0C3BB

Dark

Light

#CCC6C8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #93c4b0;
  --color-2: #b0c3bb;
  --color-3: #ccc6c8;
  --color-4: #ebbccd;
  --color-5: #ffc9ec;
}

SCSS

$color-1: #93c4b0;
$color-2: #b0c3bb;
$color-3: #ccc6c8;
$color-4: #ebbccd;
$color-5: #ffc9ec;

TAILWIND

colors: {
  'brand-1': '#93c4b0',
  'brand-2': '#b0c3bb',
  'brand-3': '#ccc6c8',
  'brand-4': '#ebbccd',
  'brand-5': '#ffc9ec',
}

RGB Array

[147, 196, 176], [176, 195, 187], [204, 198, 200], [235, 188, 205], [255, 201, 236]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #93C4B0, #B0C3BB, #CCC6C8, #EBBCCD, #FFC9EC 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: #93c4b0; --color-2: #b0c3bb; --color-3: #ccc6c8; --color-4: #ebbccd; --color-5: #ffc9ec. 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