#D16F93 + #747487 + #7B939E + #88B0B3 + #B8FFED · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#D16F93

Rouge · LightCoral · Rose Pink

HEX

#D16F93

RGB

rgb(209, 111, 147)

HSL

hsl(338, 52%, 63%)

HSB

hsb(338, 47%, 82%)

CMYK

cmyk(0%, 47%, 30%, 18%)

Oklch

oklch(66.3% 0.129 357.9)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#747487

Deep Indigo · SlateGray · Warm Gray

HEX

#747487

RGB

rgb(116, 116, 135)

HSL

hsl(240, 8%, 49%)

HSB

hsb(240, 14%, 53%)

CMYK

cmyk(14%, 14%, 0%, 47%)

Oklch

oklch(56.6% 0.029 285.4)

Traditional「Deep Indigo」· Paint「Warm Gray」· Creative Urban Concrete

#7B939E

Slate Blue · LightSlateGray · Lake Green

HEX

#7B939E

RGB

rgb(123, 147, 158)

HSL

hsl(199, 15%, 55%)

HSB

hsb(199, 22%, 62%)

CMYK

cmyk(22%, 7%, 0%, 38%)

Oklch

oklch(64.8% 0.032 227.3)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

#88B0B3

Sky Blue · DarkGray · Lake Green

HEX

#88B0B3

RGB

rgb(136, 176, 179)

HSL

hsl(184, 22%, 62%)

HSB

hsb(184, 24%, 70%)

CMYK

cmyk(24%, 2%, 0%, 30%)

Oklch

oklch(72.9% 0.043 202.0)

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

#B8FFED

Jade · LightBlue · Glacier Blue

HEX

#B8FFED

RGB

rgb(184, 255, 237)

HSL

hsl(165, 100%, 86%)

HSB

hsb(165, 28%, 100%)

CMYK

cmyk(28%, 0%, 7%, 0%)

Oklch

oklch(94.8% 0.074 177.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D16F93

70D2AE

Analogous

D270C5

D16F93

D27D70

Triadic

D16F93

94D270

7094D2

Split-Comp.

D16F93

70D27D

70C5D2

Tetradic

D16F93

C5D270

70D2AE

7D70D2

Contrast Matrix WCAG 2.1 Contrast

D16F93	747487	7B939E	88B0B3	B8FFED
—	1.4 Fail	1.0 Fail	1.4 Fail	2.9 Fail
1.4 Fail	—	1.4 Fail	1.9 Fail	4.0 AA Large
1.0 Fail	1.4 Fail	—	1.4 Fail	2.9 Fail
1.4 Fail	1.9 Fail	1.4 Fail	—	2.1 Fail
2.9 Fail	4.0 AA Large	2.9 Fail	2.1 Fail	—

White BG

3.3AA Large

4.6AA

3.2AA Large

2.4Fail

1.1Fail

Black BG

6.4AA

4.6AA

6.5AA

8.9AAA

18.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A68A

747482

85869B

999AB2

D7D7F1

Deuteranopia

ACB488

747481

84829B

9794B2

D3CDF2

Tritanopia

CC8382

747F7E

7C9999

8AB2B2

BCF5F6

Achromatopsia

909090

767676

8D8D8D

A4A4A4

E8E8E8

Shades & Tints Shades & Tints

#D16F93

Dark

Light

#747487

Dark

Light

#7B939E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d16f93;
  --color-2: #747487;
  --color-3: #7b939e;
  --color-4: #88b0b3;
  --color-5: #b8ffed;
}

SCSS

$color-1: #d16f93;
$color-2: #747487;
$color-3: #7b939e;
$color-4: #88b0b3;
$color-5: #b8ffed;

TAILWIND

colors: {
  'brand-1': '#d16f93',
  'brand-2': '#747487',
  'brand-3': '#7b939e',
  'brand-4': '#88b0b3',
  'brand-5': '#b8ffed',
}

RGB Array

[209, 111, 147], [116, 116, 135], [123, 147, 158], [136, 176, 179], [184, 255, 237]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #D16F93, #747487, #7B939E, #88B0B3, #B8FFED is ideal for: corporate websites, product showcases, portfolios. 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: #d16f93; --color-2: #747487; --color-3: #7b939e; --color-4: #88b0b3; --color-5: #b8ffed. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 pastel-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