#B71270 + #854566 + #6C617D + #527D94 + #1BA6A8 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B71270

Rose Purple · MediumVioletRed · Camellia

HEX

#B71270

RGB

rgb(183, 18, 112)

HSL

hsl(326, 82%, 39%)

HSB

hsb(326, 90%, 72%)

CMYK

cmyk(0%, 90%, 39%, 28%)

Oklch

oklch(51.6% 0.204 353.8)

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

#854566

Rose Purple · DimGray · Camellia

HEX

#854566

RGB

rgb(133, 69, 102)

HSL

hsl(329, 32%, 40%)

HSB

hsb(329, 48%, 52%)

CMYK

cmyk(0%, 48%, 23%, 48%)

Oklch

oklch(48.0% 0.097 349.1)

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

#6C617D

Deep Indigo · DimGray · Violet

HEX

#6C617D

RGB

rgb(108, 97, 125)

HSL

hsl(264, 13%, 44%)

HSB

hsb(264, 22%, 49%)

CMYK

cmyk(14%, 22%, 0%, 51%)

Oklch

oklch(51.3% 0.045 302.7)

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

#527D94

Slate Blue · SlateGray · Navy Blue

HEX

#527D94

RGB

rgb(82, 125, 148)

HSL

hsl(201, 29%, 45%)

HSB

hsb(201, 45%, 58%)

CMYK

cmyk(45%, 16%, 0%, 42%)

Oklch

oklch(56.7% 0.059 232.6)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#1BA6A8

Lake Blue · LightSeaGreen · Mint Ice

HEX

#1BA6A8

RGB

rgb(27, 166, 168)

HSL

hsl(181, 72%, 38%)

HSB

hsb(181, 84%, 66%)

CMYK

cmyk(84%, 1%, 0%, 34%)

Oklch

oklch(65.9% 0.108 196.4)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B71270

12B559

Analogous

AA12B5

B71270

B5121D

Triadic

B71270

6EB512

126EB5

Split-Comp.

B71270

1DB512

12B5AA

Tetradic

B71270

B5AA12

12B559

121DB5

Contrast Matrix WCAG 2.1 Contrast

B71270	854566	6C617D	527D94	1BA6A8
—	1.1 Fail	1.1 Fail	1.4 Fail	2.1 Fail
1.1 Fail	—	1.2 Fail	1.6 Fail	2.3 Fail
1.1 Fail	1.2 Fail	—	1.3 Fail	1.9 Fail
1.4 Fail	1.6 Fail	1.3 Fail	—	1.5 Fail
2.1 Fail	2.3 Fail	1.9 Fail	1.5 Fail	—

White BG

6.3AA

6.9AA

5.8AA

4.4AA Large

3.0Fail

Black BG

3.3AA Large

3.0AA Large

3.6AA Large

4.7AA

7.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

706E59

69695E

676776

65658E

5758A8

Deuteranopia

798654

6D725C

686975

625F8D

4F45A7

Tritanopia

AF4743

825856

6B7170

548A89

22A7A7

Achromatopsia

4E4E4E

5C5C5C

676767

737373

7D7D7D

Shades & Tints Shades & Tints

#B71270

Dark

Light

#854566

Dark

Light

#6C617D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b71270;
  --color-2: #854566;
  --color-3: #6c617d;
  --color-4: #527d94;
  --color-5: #1ba6a8;
}

SCSS

$color-1: #b71270;
$color-2: #854566;
$color-3: #6c617d;
$color-4: #527d94;
$color-5: #1ba6a8;

TAILWIND

colors: {
  'brand-1': '#b71270',
  'brand-2': '#854566',
  'brand-3': '#6c617d',
  'brand-4': '#527d94',
  'brand-5': '#1ba6a8',
}

RGB Array

[183, 18, 112], [133, 69, 102], [108, 97, 125], [82, 125, 148], [27, 166, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B71270, #854566, #6C617D, #527D94, #1BA6A8 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: #b71270; --color-2: #854566; --color-3: #6c617d; --color-4: #527d94; --color-5: #1ba6a8. 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