#EEFCE6 + #D9F7C6 + #B0BACF + #9F8FB3 + #9879A6 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EEFCE6

Emerald · Beige · Mint Green

HEX

#EEFCE6

RGB

rgb(238, 252, 230)

HSL

hsl(98, 79%, 95%)

HSB

hsb(98, 9%, 99%)

CMYK

cmyk(6%, 0%, 9%, 1%)

Oklch

oklch(97.5% 0.032 133.9)

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

#D9F7C6

Emerald · Beige · Mint Green

HEX

#D9F7C6

RGB

rgb(217, 247, 198)

HSL

hsl(97, 75%, 87%)

HSB

hsb(97, 20%, 97%)

CMYK

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

Oklch

oklch(94.2% 0.072 133.4)

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

#B0BACF

Azure · LightSteelBlue · Cobalt Blue

HEX

#B0BACF

RGB

rgb(176, 186, 207)

HSL

hsl(221, 24%, 75%)

HSB

hsb(221, 15%, 81%)

CMYK

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

Oklch

oklch(78.8% 0.032 265.3)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#9F8FB3

Wisteria · DarkGray · Lilac Purple

HEX

#9F8FB3

RGB

rgb(159, 143, 179)

HSL

hsl(267, 19%, 63%)

HSB

hsb(267, 20%, 70%)

CMYK

cmyk(11%, 20%, 0%, 30%)

Oklch

oklch(67.6% 0.055 305.1)

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

#9879A6

Dark Plum · LightSlateGray · Violet

HEX

#9879A6

RGB

rgb(152, 121, 166)

HSL

hsl(281, 20%, 56%)

HSB

hsb(281, 27%, 65%)

CMYK

cmyk(8%, 27%, 0%, 35%)

Oklch

oklch(62.2% 0.075 315.1)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EEFCE6

F5E8FC

Analogous

FAFCE8

EEFCE6

E8FCEB

Triadic

EEFCE6

E8F0FC

FCE8F0

Split-Comp.

EEFCE6

EBE8FC

FCE8FA

Tetradic

EEFCE6

E8FAFC

F5E8FC

FCEBE8

Contrast Matrix WCAG 2.1 Contrast

EEFCE6	D9F7C6	B0BACF	9F8FB3	9879A6
—	1.1 Fail	1.8 Fail	2.8 Fail	3.5 AA Large
1.1 Fail	—	1.7 Fail	2.6 Fail	3.2 AA Large
1.8 Fail	1.7 Fail	—	1.5 Fail	1.9 Fail
2.8 Fail	2.6 Fail	1.5 Fail	—	1.3 Fail
3.5 AA Large	3.2 AA Large	1.9 Fail	1.3 Fail	—

White BG

1.1Fail

1.2Fail

1.9Fail

3.0Fail

3.7AA Large

Black BG

19.7AAA

18.1AAA

10.8AAA

7.1AAA

5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F4F4EB

E6E6D2

B4B4CA

9898AA

8B8A9B

Deuteranopia

F3F2ED

E4E2D5

B4B3C9

999AA8

8C8F99

Tritanopia

EFF0F0

DADBDD

B1C6C5

9EA3A2

969391

Achromatopsia

F5F5F5

E8E8E8

B9B9B9

989898

878787

Shades & Tints Shades & Tints

#EEFCE6

Dark

Light

#D9F7C6

Dark

Light

#B0BACF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eefce6;
  --color-2: #d9f7c6;
  --color-3: #b0bacf;
  --color-4: #9f8fb3;
  --color-5: #9879a6;
}

SCSS

$color-1: #eefce6;
$color-2: #d9f7c6;
$color-3: #b0bacf;
$color-4: #9f8fb3;
$color-5: #9879a6;

TAILWIND

colors: {
  'brand-1': '#eefce6',
  'brand-2': '#d9f7c6',
  'brand-3': '#b0bacf',
  'brand-4': '#9f8fb3',
  'brand-5': '#9879a6',
}

RGB Array

[238, 252, 230], [217, 247, 198], [176, 186, 207], [159, 143, 179], [152, 121, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #EEFCE6, #D9F7C6, #B0BACF, #9F8FB3, #9879A6 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: #eefce6; --color-2: #d9f7c6; --color-3: #b0bacf; --color-4: #9f8fb3; --color-5: #9879a6. 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 space-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