#B56B98 + #6D5895 + #716DBA + #70AECC + #BBCC8D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B56B98

Rose Purple · Gray · Rose Pink

HEX

#B56B98

RGB

rgb(181, 107, 152)

HSL

hsl(324, 33%, 56%)

HSB

hsb(324, 41%, 71%)

CMYK

cmyk(0%, 41%, 16%, 29%)

Oklch

oklch(62.3% 0.110 343.5)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

#6D5895

Deep Indigo · SlateGray · Violet

HEX

#6D5895

RGB

rgb(109, 88, 149)

HSL

hsl(261, 26%, 46%)

HSB

hsb(261, 41%, 58%)

CMYK

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

Oklch

oklch(50.8% 0.097 298.8)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

#716DBA

Deep Indigo · SlateBlue · Navy Blue

HEX

#716DBA

RGB

rgb(113, 109, 186)

HSL

hsl(243, 36%, 58%)

HSB

hsb(243, 41%, 73%)

CMYK

cmyk(39%, 41%, 0%, 27%)

Oklch

oklch(57.3% 0.117 284.4)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#70AECC

Sky Blue · CornflowerBlue · Cobalt Blue

HEX

#70AECC

RGB

rgb(112, 174, 204)

HSL

hsl(200, 47%, 62%)

HSB

hsb(200, 45%, 80%)

CMYK

cmyk(45%, 15%, 0%, 20%)

Oklch

oklch(72.0% 0.077 230.1)

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

#BBCC8D

Willow Green · Tan · Apple Green

HEX

#BBCC8D

RGB

rgb(187, 204, 141)

HSL

hsl(76, 38%, 68%)

HSB

hsb(76, 31%, 80%)

CMYK

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

Oklch

oklch(81.7% 0.086 120.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B56B98

6AB487

Analogous

AC6AB4

B56B98

B46A71

Triadic

B56B98

96B46A

6A96B4

Split-Comp.

B56B98

71B46A

6AB4AC

Tetradic

B56B98

B4AC6A

6AB487

6A71B4

Contrast Matrix WCAG 2.1 Contrast

B56B98	6D5895	716DBA	70AECC	BBCC8D
—	1.6 Fail	1.2 Fail	1.6 Fail	2.2 Fail
1.6 Fail	—	1.3 Fail	2.5 Fail	3.5 AA Large
1.2 Fail	1.3 Fail	—	1.9 Fail	2.6 Fail
1.6 Fail	2.5 Fail	1.9 Fail	—	1.4 Fail
2.2 Fail	3.5 AA Large	2.6 Fail	1.4 Fail	—

White BG

3.8AA Large

6.0AA

4.6AA

2.4Fail

1.7Fail

Black BG

5.5AA

3.5AA Large

4.6AA

8.6AAA

12.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

95948D

646486

6F6FA7

8B8BC5

C2C39C

Deuteranopia

999F8B

656783

7070A3

8783C3

C1C0A0

Tritanopia

B18583

6C7B78

719995

73BFBE

BCA8AB

Achromatopsia

868686

656565

777777

9F9F9F

C0C0C0

Shades & Tints Shades & Tints

#B56B98

Dark

Light

#6D5895

Dark

Light

#716DBA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b56b98;
  --color-2: #6d5895;
  --color-3: #716dba;
  --color-4: #70aecc;
  --color-5: #bbcc8d;
}

SCSS

$color-1: #b56b98;
$color-2: #6d5895;
$color-3: #716dba;
$color-4: #70aecc;
$color-5: #bbcc8d;

TAILWIND

colors: {
  'brand-1': '#b56b98',
  'brand-2': '#6d5895',
  'brand-3': '#716dba',
  'brand-4': '#70aecc',
  'brand-5': '#bbcc8d',
}

RGB Array

[181, 107, 152], [109, 88, 149], [113, 109, 186], [112, 174, 204], [187, 204, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B56B98, #6D5895, #716DBA, #70AECC, #BBCC8D 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: #b56b98; --color-2: #6d5895; --color-3: #716dba; --color-4: #70aecc; --color-5: #bbcc8d. 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 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