#D6FA93 + #B2DFED + #C7BFDB + #A6A1A1 + #F5E4E8 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D6FA93

Willow Green · Khaki · Apple Green

HEX

#D6FA93

RGB

rgb(214, 250, 147)

HSL

hsl(81, 91%, 78%)

HSB

hsb(81, 41%, 98%)

CMYK

cmyk(14%, 0%, 41%, 2%)

Oklch

oklch(93.7% 0.135 124.7)

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

#B2DFED

Sky Blue · LightBlue · Glacier Blue

HEX

#B2DFED

RGB

rgb(178, 223, 237)

HSL

hsl(194, 62%, 81%)

HSB

hsb(194, 25%, 93%)

CMYK

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

Oklch

oklch(87.6% 0.051 218.7)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#C7BFDB

Wisteria · LightSteelBlue · Cobalt Blue

HEX

#C7BFDB

RGB

rgb(199, 191, 219)

HSL

hsl(257, 28%, 80%)

HSB

hsb(257, 13%, 86%)

CMYK

cmyk(9%, 13%, 0%, 14%)

Oklch

oklch(82.0% 0.040 298.6)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#A6A1A1

Ash · DarkGray · Silver Sand

HEX

#A6A1A1

RGB

rgb(166, 161, 161)

HSL

hsl(0, 3%, 64%)

HSB

hsb(0, 3%, 65%)

CMYK

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

Oklch

oklch(71.3% 0.006 17.3)

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

#F5E4E8

Peach Pink · Linen · Cherry Blossom

HEX

#F5E4E8

RGB

rgb(245, 228, 232)

HSL

hsl(346, 46%, 93%)

HSB

hsb(346, 7%, 96%)

CMYK

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

Oklch

oklch(93.4% 0.019 1.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D6FA93

B894FA

Analogous

FAEB94

D6FA93

A3FA94

Triadic

D6FA93

94D6FA

FA94D6

Split-Comp.

D6FA93

94A3FA

EB94FA

Tetradic

D6FA93

94FAEB

B894FA

FA94A3

Contrast Matrix WCAG 2.1 Contrast

D6FA93	B2DFED	C7BFDB	A6A1A1	F5E4E8
—	1.2 Fail	1.5 Fail	2.2 Fail	1.0 Fail
1.2 Fail	—	1.2 Fail	1.8 Fail	1.2 Fail
1.5 Fail	1.2 Fail	—	1.4 Fail	1.4 Fail
2.2 Fail	1.8 Fail	1.4 Fail	—	2.1 Fail
1.0 Fail	1.2 Fail	1.4 Fail	2.1 Fail	—

White BG

1.2Fail

1.4Fail

1.8Fail

2.6Fail

1.2Fail

Black BG

18.0AAA

14.7AAA

11.9AAA

8.2AAA

17.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E6AC

C5C6EA

C4C3D4

A4A4A1

EEEDE7

Deuteranopia

E4E1B2

C3C0E9

C4C5D3

A4A5A1

EFF0E7

Tritanopia

D8C0C4

B4E7E6

C7CFCE

A6A1A1

F4E6E6

Achromatopsia

E3E3E3

D3D3D3

C5C5C5

A2A2A2

EAEAEA

Shades & Tints Shades & Tints

#D6FA93

Dark

Light

#B2DFED

Dark

Light

#C7BFDB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d6fa93;
  --color-2: #b2dfed;
  --color-3: #c7bfdb;
  --color-4: #a6a1a1;
  --color-5: #f5e4e8;
}

SCSS

$color-1: #d6fa93;
$color-2: #b2dfed;
$color-3: #c7bfdb;
$color-4: #a6a1a1;
$color-5: #f5e4e8;

TAILWIND

colors: {
  'brand-1': '#d6fa93',
  'brand-2': '#b2dfed',
  'brand-3': '#c7bfdb',
  'brand-4': '#a6a1a1',
  'brand-5': '#f5e4e8',
}

RGB Array

[214, 250, 147], [178, 223, 237], [199, 191, 219], [166, 161, 161], [245, 228, 232]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #D6FA93, #B2DFED, #C7BFDB, #A6A1A1, #F5E4E8 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: #d6fa93; --color-2: #b2dfed; --color-3: #c7bfdb; --color-4: #a6a1a1; --color-5: #f5e4e8. 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