← Back to Editor

#B14FAC · #814194 · #474667 · #44587E · #297F93

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B14FAC

Rose Purple · MediumOrchid · Violet

HEX
#B14FAC
RGB
rgb(177, 79, 172)
HSL
hsl(303, 39%, 50%)
HSB
hsb(303, 55%, 69%)
CMYK
cmyk(0%, 55%, 3%, 31%)
Oklch
oklch(58.6% 0.171 329.5)

TraditionalRose Purple」· PaintViolet」· Creative Blush Sunrise

#814194

Dark Plum · DarkSlateBlue · Violet

HEX
#814194
RGB
rgb(129, 65, 148)
HSL
hsl(286, 39%, 42%)
HSB
hsb(286, 56%, 58%)
CMYK
cmyk(13%, 56%, 0%, 42%)
Oklch
oklch(49.0% 0.143 318.0)

TraditionalDark Plum」· PaintViolet」· Creative Blush Sunrise

#474667

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#474667
RGB
rgb(71, 70, 103)
HSL
hsl(242, 19%, 34%)
HSB
hsb(242, 32%, 40%)
CMYK
cmyk(31%, 32%, 0%, 60%)
Oklch
oklch(40.9% 0.055 285.1)

TraditionalDeep Indigo」· PaintPrussian Blue」· Creative Blush Sunrise

#44587E

Indigo · DarkSlateBlue · Prussian Blue

HEX
#44587E
RGB
rgb(68, 88, 126)
HSL
hsl(219, 30%, 38%)
HSB
hsb(219, 46%, 49%)
CMYK
cmyk(46%, 30%, 0%, 51%)
Oklch
oklch(46.1% 0.067 262.7)

TraditionalIndigo」· PaintPrussian Blue」· Creative Blush Sunrise

#297F93

Lake Blue · SteelBlue · Mint Ice

HEX
#297F93
RGB
rgb(41, 127, 147)
HSL
hsl(191, 56%, 37%)
HSB
hsb(191, 72%, 58%)
CMYK
cmyk(72%, 14%, 0%, 42%)
Oklch
oklch(55.5% 0.085 216.6)

TraditionalLake Blue」· PaintMint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B14FAC
4EB153

Analogous

844EB1
B14FAC
B14E7B

Triadic

B14FAC
ACB14E
4EACB1

Split-Comp.

B14FAC
7BB14E
4EB184

Tetradic

B14FAC
B1844E
4EB153
4E7BB1

Contrast Matrix WCAG 2.1 Contrast

B14FAC
814194
474667
44587E
297F93
1.5
Fail
2.0
Fail
1.6
Fail
1.0
Fail
1.5
Fail
1.3
Fail
1.1
Fail
1.5
Fail
2.0
Fail
1.3
Fail
1.3
Fail
1.9
Fail
1.6
Fail
1.1
Fail
1.3
Fail
1.5
Fail
1.0
Fail
1.5
Fail
1.9
Fail
1.5
Fail
White BG
4.6AA
6.7AA
9.0AAA
7.1AAA
4.6AA
Black BG
4.6AA
3.1AA Large
2.3Fail
2.9Fail
4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

878695
656580
47475F
4D4D75
4E4F8E

Deuteranopia

8C9490
696E7B
47475D
4C4A73
49438D

Tritanopia

AC8480
7E706D
475957
456E6C
2D8A8A

Achromatopsia

777777
5E5E5E
4A4A4A
565656
686868

Shades & Tints Shades & Tints

#B14FAC

Dark
Light

#814194

Dark
Light

#474667

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b14fac;
  --color-2: #814194;
  --color-3: #474667;
  --color-4: #44587e;
  --color-5: #297f93;
}

SCSS

$color-1: #b14fac;
$color-2: #814194;
$color-3: #474667;
$color-4: #44587e;
$color-5: #297f93;

TAILWIND

colors: {
  'brand-1': '#b14fac',
  'brand-2': '#814194',
  'brand-3': '#474667',
  'brand-4': '#44587e',
  'brand-5': '#297f93',
}

RGB Array

[177, 79, 172], [129, 65, 148], [71, 70, 103], [68, 88, 126], [41, 127, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B14FAC, #814194, #474667, #44587E, #297F93 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: #b14fac; --color-2: #814194; --color-3: #474667; --color-4: #44587e; --color-5: #297f93. 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