← Back to Editor

#4F00E5 · #3A45E9 · #646C84 · #9D5656 · #1968FF

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#4F00E5

Deep Indigo · DarkViolet · Violet

HEX
#4F00E5
RGB
rgb(79, 0, 229)
HSL
hsl(261, 100%, 45%)
HSB
hsb(261, 100%, 90%)
CMYK
cmyk(66%, 100%, 0%, 10%)
Oklch
oklch(45.4% 0.272 281.2)

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

#3A45E9

Azure · SlateBlue · Navy Blue

HEX
#3A45E9
RGB
rgb(58, 69, 233)
HSL
hsl(236, 80%, 57%)
HSB
hsb(236, 75%, 91%)
CMYK
cmyk(75%, 70%, 0%, 9%)
Oklch
oklch(50.1% 0.241 271.0)

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

#646C84

Indigo · SlateGray · Navy Blue

HEX
#646C84
RGB
rgb(100, 108, 132)
HSL
hsl(225, 14%, 45%)
HSB
hsb(225, 24%, 52%)
CMYK
cmyk(24%, 18%, 0%, 48%)
Oklch
oklch(53.3% 0.039 270.6)

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

#9D5656

Crimson · Sienna · Passion Red

HEX
#9D5656
RGB
rgb(157, 86, 86)
HSL
hsl(0, 29%, 48%)
HSB
hsb(0, 45%, 62%)
CMYK
cmyk(0%, 45%, 45%, 38%)
Oklch
oklch(53.7% 0.094 20.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#1968FF

Azure · DodgerBlue · Navy Blue

HEX
#1968FF
RGB
rgb(25, 104, 255)
HSL
hsl(219, 100%, 55%)
HSB
hsb(219, 90%, 100%)
CMYK
cmyk(90%, 59%, 0%, 0%)
Oklch
oklch(57.0% 0.236 261.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4F00E5
95E600

Analogous

0022E6
4F00E5
C300E6

Triadic

4F00E5
E65000
00E650

Split-Comp.

4F00E5
E6C300
22E600

Tetradic

4F00E5
E60022
95E600
00E6C3

Contrast Matrix WCAG 2.1 Contrast

4F00E5
3A45E9
646C84
9D5656
1968FF
—
1.3
Fail
1.6
Fail
1.6
Fail
1.8
Fail
1.3
Fail
—
1.3
Fail
1.2
Fail
1.4
Fail
1.6
Fail
1.3
Fail
—
1.0
Fail
1.1
Fail
1.6
Fail
1.2
Fail
1.0
Fail
—
1.1
Fail
1.8
Fail
1.4
Fail
1.1
Fail
1.1
Fail
—
White BG
8.5AAA
6.5AA
5.2AA
5.4AA
4.7AA
Black BG
2.5Fail
3.2AA Large
4.0AA Large
3.9AA Large
4.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

2D2CAE
3F3FC1
67687E
7E7E56
3B3CDA

Deuteranopia

3137A0
3E3DB8
67667D
828856
3731D2

Tritanopia

4B8278
3BA29B
647A79
995656
1DBEB7

Achromatopsia

323232
545454
6C6C6C
6B6B6B
626262

Shades & Tints Shades & Tints

#4F00E5

Dark
Light

#3A45E9

Dark
Light

#646C84

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4f00e5;
  --color-2: #3a45e9;
  --color-3: #646c84;
  --color-4: #9d5656;
  --color-5: #1968ff;
}

SCSS

$color-1: #4f00e5;
$color-2: #3a45e9;
$color-3: #646c84;
$color-4: #9d5656;
$color-5: #1968ff;

TAILWIND

colors: {
  'brand-1': '#4f00e5',
  'brand-2': '#3a45e9',
  'brand-3': '#646c84',
  'brand-4': '#9d5656',
  'brand-5': '#1968ff',
}

RGB Array

[79, 0, 229], [58, 69, 233], [100, 108, 132], [157, 86, 86], [25, 104, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4F00E5, #3A45E9, #646C84, #9D5656, #1968FF is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #4f00e5; --color-2: #3a45e9; --color-3: #646c84; --color-4: #9d5656; --color-5: #1968ff. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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