← Back to Editor

#672D70 · #994587 · #BF508F · #D66991 · #F47382

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#672D70

Dark Plum · DarkSlateBlue · Eggplant

HEX
#672D70
RGB
rgb(103, 45, 112)
HSL
hsl(292, 43%, 31%)
HSB
hsb(292, 60%, 44%)
CMYK
cmyk(8%, 60%, 0%, 56%)
Oklch
oklch(40.5% 0.124 322.1)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#994587

Rose Purple · Gray · Violet

HEX
#994587
RGB
rgb(153, 69, 135)
HSL
hsl(313, 38%, 44%)
HSB
hsb(313, 55%, 60%)
CMYK
cmyk(0%, 55%, 12%, 40%)
Oklch
oklch(52.2% 0.139 336.3)

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

#BF508F

Rose Purple · MediumVioletRed · Rose Pink

HEX
#BF508F
RGB
rgb(191, 80, 143)
HSL
hsl(326, 46%, 53%)
HSB
hsb(326, 58%, 75%)
CMYK
cmyk(0%, 58%, 25%, 25%)
Oklch
oklch(59.4% 0.159 347.8)

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

#D66991

Rouge · LightCoral · Rose Pink

HEX
#D66991
RGB
rgb(214, 105, 145)
HSL
hsl(338, 57%, 63%)
HSB
hsb(338, 51%, 84%)
CMYK
cmyk(0%, 51%, 32%, 16%)
Oklch
oklch(66.0% 0.143 358.6)

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

#F47382

Peach Pink · LightCoral · Coral Red

HEX
#F47382
RGB
rgb(244, 115, 130)
HSL
hsl(353, 85%, 70%)
HSB
hsb(353, 53%, 96%)
CMYK
cmyk(0%, 53%, 47%, 4%)
Oklch
oklch(71.1% 0.159 14.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

672D70
36712D

Analogous

462D71
672D70
712D58

Triadic

672D70
71682D
2D7168

Split-Comp.

672D70
58712D
2D7146

Tetradic

672D70
71462D
36712D
2D5871

Contrast Matrix WCAG 2.1 Contrast

672D70
994587
BF508F
D66991
F47382
—
1.6
Fail
2.2
Fail
2.9
Fail
3.5
AA Large
1.6
Fail
—
1.3
Fail
1.8
Fail
2.1
Fail
2.2
Fail
1.3
Fail
—
1.3
Fail
1.6
Fail
2.9
Fail
1.8
Fail
1.3
Fail
—
1.2
Fail
3.5
AA Large
2.1
Fail
1.6
Fail
1.2
Fail
—
White BG
9.6AAA
5.9AA
4.4AA Large
3.3AA Large
2.8Fail
Black BG
2.2Fail
3.6AA Large
4.8AA
6.3AA
7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4D60
757477
8F8E80
A7A687
BCBB7E

Deuteranopia

51565C
7A8073
959E7C
ADB585
C4CD7E

Tritanopia

645350
956A68
B97471
D1807E
EE7C7B

Achromatopsia

464646
666666
787878
8E8E8E
9B9B9B

Shades & Tints Shades & Tints

#672D70

Dark
Light

#994587

Dark
Light

#BF508F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #672d70;
  --color-2: #994587;
  --color-3: #bf508f;
  --color-4: #d66991;
  --color-5: #f47382;
}

SCSS

$color-1: #672d70;
$color-2: #994587;
$color-3: #bf508f;
$color-4: #d66991;
$color-5: #f47382;

TAILWIND

colors: {
  'brand-1': '#672d70',
  'brand-2': '#994587',
  'brand-3': '#bf508f',
  'brand-4': '#d66991',
  'brand-5': '#f47382',
}

RGB Array

[103, 45, 112], [153, 69, 135], [191, 80, 143], [214, 105, 145], [244, 115, 130]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #672D70, #994587, #BF508F, #D66991, #F47382 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: #672d70; --color-2: #994587; --color-3: #bf508f; --color-4: #d66991; --color-5: #f47382. 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