#B2CFE2 + #B5B1D6 + #BA8CA7 + #BA6B68 + #BB5B3C · 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

#B2CFE2

Sky Blue · LightBlue · Cobalt Blue

HEX

#B2CFE2

RGB

rgb(178, 207, 226)

HSL

hsl(204, 45%, 79%)

HSB

hsb(204, 21%, 89%)

CMYK

cmyk(21%, 8%, 0%, 11%)

Oklch

oklch(83.9% 0.041 236.7)

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

#B5B1D6

Wisteria · LightSteelBlue · Cobalt Blue

HEX

#B5B1D6

RGB

rgb(181, 177, 214)

HSL

hsl(246, 31%, 77%)

HSB

hsb(246, 17%, 84%)

CMYK

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

Oklch

oklch(77.6% 0.052 290.1)

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

#BA8CA7

Mauve · DarkGray · Rose Pink

HEX

#BA8CA7

RGB

rgb(186, 140, 167)

HSL

hsl(325, 25%, 64%)

HSB

hsb(325, 25%, 73%)

CMYK

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

Oklch

oklch(69.2% 0.066 342.9)

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

#BA6B68

Crimson · LightCoral · Passion Red

HEX

#BA6B68

RGB

rgb(186, 107, 104)

HSL

hsl(2, 37%, 57%)

HSB

hsb(2, 44%, 73%)

CMYK

cmyk(0%, 42%, 44%, 27%)

Oklch

oklch(61.5% 0.101 22.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#BB5B3C

Tangerine · Sienna · Amber Brown

HEX

#BB5B3C

RGB

rgb(187, 91, 60)

HSL

hsl(15, 51%, 48%)

HSB

hsb(15, 68%, 73%)

CMYK

cmyk(0%, 51%, 68%, 27%)

Oklch

oklch(58.2% 0.132 38.4)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B2CFE2

E2C5B1

Analogous

B1E2DD

B2CFE2

B1B6E2

Triadic

B2CFE2

E2B1CE

CEE2B1

Split-Comp.

B2CFE2

E2B1B6

E2DDB1

Tetradic

B2CFE2

DDB1E2

E2C5B1

B6E2B1

Contrast Matrix WCAG 2.1 Contrast

B2CFE2	B5B1D6	BA8CA7	BA6B68	BB5B3C
—	1.3 Fail	1.7 Fail	2.4 Fail	2.8 Fail
1.3 Fail	—	1.4 Fail	1.9 Fail	2.2 Fail
1.7 Fail	1.4 Fail	—	1.4 Fail	1.6 Fail
2.4 Fail	1.9 Fail	1.4 Fail	—	1.2 Fail
2.8 Fail	2.2 Fail	1.6 Fail	1.2 Fail	—

White BG

1.6Fail

2.1Fail

2.8Fail

3.9AA Large

4.5AA Large

Black BG

12.9AAA

10.2AAA

7.4AAA

5.4AA

4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBFDD

B3B3CD

A6A6A0

989769

919144

Deuteranopia

BDBBDC

B4B4CB

A9AC9F

9CA269

979E45

Tritanopia

B3DAD9

B5C6C4

B89B9A

B66969

B6494B

Achromatopsia

C8C8C8

B6B6B6

9D9D9D

828282

747474

Shades & Tints Shades & Tints

#B2CFE2

Dark

Light

#B5B1D6

Dark

Light

#BA8CA7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b2cfe2;
  --color-2: #b5b1d6;
  --color-3: #ba8ca7;
  --color-4: #ba6b68;
  --color-5: #bb5b3c;
}

SCSS

$color-1: #b2cfe2;
$color-2: #b5b1d6;
$color-3: #ba8ca7;
$color-4: #ba6b68;
$color-5: #bb5b3c;

TAILWIND

colors: {
  'brand-1': '#b2cfe2',
  'brand-2': '#b5b1d6',
  'brand-3': '#ba8ca7',
  'brand-4': '#ba6b68',
  'brand-5': '#bb5b3c',
}

RGB Array

[178, 207, 226], [181, 177, 214], [186, 140, 167], [186, 107, 104], [187, 91, 60]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #B2CFE2, #B5B1D6, #BA8CA7, #BA6B68, #BB5B3C 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: #b2cfe2; --color-2: #b5b1d6; --color-3: #ba8ca7; --color-4: #ba6b68; --color-5: #bb5b3c. 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