← Back to Editor

#435986 · #903463 · #BF1B4C · #EF0335 · #604B78

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

#435986

Indigo · DarkSlateBlue · Prussian Blue

HEX
#435986
RGB
rgb(67, 89, 134)
HSL
hsl(220, 33%, 39%)
HSB
hsb(220, 50%, 53%)
CMYK
cmyk(50%, 34%, 0%, 47%)
Oklch
oklch(46.7% 0.078 263.8)

TraditionalIndigo」· PaintPrussian Blue」· Creative Blush Sunrise

#903463

Rose Purple · Brown · Camellia

HEX
#903463
RGB
rgb(144, 52, 99)
HSL
hsl(329, 47%, 38%)
HSB
hsb(329, 64%, 56%)
CMYK
cmyk(0%, 64%, 31%, 44%)
Oklch
oklch(47.0% 0.134 351.8)

TraditionalRose Purple」· PaintCamellia」· Creative Blush Sunrise

#BF1B4C

Dark Violet · Crimson · Camellia

HEX
#BF1B4C
RGB
rgb(191, 27, 76)
HSL
hsl(342, 75%, 43%)
HSB
hsb(342, 86%, 75%)
CMYK
cmyk(0%, 86%, 60%, 25%)
Oklch
oklch(52.3% 0.195 11.6)

TraditionalDark Violet」· PaintCamellia」· Creative Blush Sunrise

#EF0335

Vermilion · Crimson · Passion Red

HEX
#EF0335
RGB
rgb(239, 3, 53)
HSL
hsl(347, 98%, 47%)
HSB
hsb(347, 99%, 94%)
CMYK
cmyk(0%, 99%, 78%, 6%)
Oklch
oklch(60.2% 0.242 22.5)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#604B78

Deep Indigo · DarkSlateBlue · Eggplant

HEX
#604B78
RGB
rgb(96, 75, 120)
HSL
hsl(268, 23%, 38%)
HSB
hsb(268, 37%, 47%)
CMYK
cmyk(20%, 37%, 0%, 53%)
Oklch
oklch(45.3% 0.076 305.0)

TraditionalDeep Indigo」· PaintEggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

435986
846E43

Analogous

437984
435986
4E4384

Triadic

435986
844359
598443

Split-Comp.

435986
844E43
798443

Tetradic

435986
844379
846E43
43844E

Contrast Matrix WCAG 2.1 Contrast

435986
903463
BF1B4C
EF0335
604B78
1.1
Fail
1.2
Fail
1.6
Fail
1.1
Fail
1.1
Fail
1.2
Fail
1.7
Fail
1.0
Fail
1.2
Fail
1.2
Fail
1.4
Fail
1.3
Fail
1.6
Fail
1.7
Fail
1.4
Fail
1.7
Fail
1.1
Fail
1.0
Fail
1.3
Fail
1.7
Fail
White BG
7.0AA
7.3AAA
6.0AA
4.4AA Large
7.6AAA
Black BG
3.0AA Large
2.9Fail
3.5AA Large
4.7AA
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4D4D7B
686758
787740
898729
57576D

Deuteranopia

4B4A79
6E7455
828E3D
97A826
585A6B

Tritanopia

447371
8B4F4D
B73735
E31F1D
5F6563

Achromatopsia

585858
555555
525252
4F4F4F
565656

Shades & Tints Shades & Tints

#435986

Dark
Light

#903463

Dark
Light

#BF1B4C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #435986;
  --color-2: #903463;
  --color-3: #bf1b4c;
  --color-4: #ef0335;
  --color-5: #604b78;
}

SCSS

$color-1: #435986;
$color-2: #903463;
$color-3: #bf1b4c;
$color-4: #ef0335;
$color-5: #604b78;

TAILWIND

colors: {
  'brand-1': '#435986',
  'brand-2': '#903463',
  'brand-3': '#bf1b4c',
  'brand-4': '#ef0335',
  'brand-5': '#604b78',
}

RGB Array

[67, 89, 134], [144, 52, 99], [191, 27, 76], [239, 3, 53], [96, 75, 120]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #435986, #903463, #BF1B4C, #EF0335, #604B78 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: #435986; --color-2: #903463; --color-3: #bf1b4c; --color-4: #ef0335; --color-5: #604b78. 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