← Back to Editor

#42499E · #2E142F · #8A4899 · #E7BA5F · #EC7700

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 LibraryData Visualization

Color Details Color Details

#42499E

Indigo · DarkSlateBlue · Navy Blue

HEX
#42499E
RGB
rgb(66, 73, 158)
HSL
hsl(235, 41%, 44%)
HSB
hsb(235, 58%, 62%)
CMYK
cmyk(58%, 54%, 0%, 38%)
Oklch
oklch(44.7% 0.136 275.9)

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

#2E142F

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2E142F
RGB
rgb(46, 20, 47)
HSL
hsl(298, 40%, 13%)
HSB
hsb(298, 57%, 18%)
CMYK
cmyk(2%, 57%, 0%, 82%)
Oklch
oklch(24.2% 0.061 325.9)

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

#8A4899

Dark Plum · DarkOrchid · Violet

HEX
#8A4899
RGB
rgb(138, 72, 153)
HSL
hsl(289, 36%, 44%)
HSB
hsb(289, 53%, 60%)
CMYK
cmyk(10%, 53%, 0%, 40%)
Oklch
oklch(51.5% 0.141 319.9)

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

#E7BA5F

Ginger · SandyBrown · Sunflower

HEX
#E7BA5F
RGB
rgb(231, 186, 95)
HSL
hsl(40, 74%, 64%)
HSB
hsb(40, 59%, 91%)
CMYK
cmyk(0%, 19%, 59%, 9%)
Oklch
oklch(81.1% 0.121 83.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#EC7700

Ochre · Chocolate · Amber Brown

HEX
#EC7700
RGB
rgb(236, 119, 0)
HSL
hsl(30, 100%, 46%)
HSB
hsb(30, 100%, 93%)
CMYK
cmyk(0%, 50%, 100%, 7%)
Oklch
oklch(69.2% 0.175 53.5)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

42499E
9E9742

Analogous

42789E
42499E
69429E

Triadic

42499E
9E424A
4A9E42

Split-Comp.

42499E
9E6942
789E42

Tetradic

42499E
9E4278
9E9742
429E69

Contrast Matrix WCAG 2.1 Contrast

42499E
2E142F
8A4899
E7BA5F
EC7700
—
2.1
Fail
1.3
Fail
4.3
AA Large
2.7
Fail
2.1
Fail
—
2.8
Fail
9.2
AAA
5.7
AA
1.3
Fail
2.8
Fail
—
3.3
AA Large
2.1
Fail
4.3
AA Large
9.2
AAA
3.3
AA Large
—
1.6
Fail
2.7
Fail
5.7
AA
2.1
Fail
1.6
Fail
—
White BG
7.8AAA
16.7AAA
6.1AA
1.8Fail
2.9Fail
Black BG
2.7Fail
1.3Fail
3.5AA Large
11.6AAA
7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

454589
232328
6D6D85
D4D375
B9B81D

Deuteranopia

454485
242627
717681
D6DA7A
C0C924

Tritanopia

427976
2D2322
877673
E5868A
E63439

Achromatopsia

515151
1F1F1F
656565
BDBDBD
8C8C8C

Shades & Tints Shades & Tints

#42499E

Dark
Light

#2E142F

Dark
Light

#8A4899

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #42499e;
  --color-2: #2e142f;
  --color-3: #8a4899;
  --color-4: #e7ba5f;
  --color-5: #ec7700;
}

SCSS

$color-1: #42499e;
$color-2: #2e142f;
$color-3: #8a4899;
$color-4: #e7ba5f;
$color-5: #ec7700;

TAILWIND

colors: {
  'brand-1': '#42499e',
  'brand-2': '#2e142f',
  'brand-3': '#8a4899',
  'brand-4': '#e7ba5f',
  'brand-5': '#ec7700',
}

RGB Array

[66, 73, 158], [46, 20, 47], [138, 72, 153], [231, 186, 95], [236, 119, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #42499E, #2E142F, #8A4899, #E7BA5F, #EC7700 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #42499e; --color-2: #2e142f; --color-3: #8a4899; --color-4: #e7ba5f; --color-5: #ec7700. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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