← Back to Editor

#1E3B7F · #061D49 · #3F5795 · #AFA84E · #EDFFC0

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

Color Details Color Details

#1E3B7F

Indigo · MidnightBlue · Prussian Blue

HEX
#1E3B7F
RGB
rgb(30, 59, 127)
HSL
hsl(222, 62%, 31%)
HSB
hsb(222, 76%, 50%)
CMYK
cmyk(76%, 54%, 0%, 50%)
Oklch
oklch(37.2% 0.121 264.0)

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

#061D49

Indigo · MidnightBlue · Deep Sea Blue

HEX
#061D49
RGB
rgb(6, 29, 73)
HSL
hsl(219, 85%, 15%)
HSB
hsb(219, 92%, 29%)
CMYK
cmyk(92%, 60%, 0%, 71%)
Oklch
oklch(24.5% 0.087 261.4)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#3F5795

Indigo · DarkSlateBlue · Navy Blue

HEX
#3F5795
RGB
rgb(63, 87, 149)
HSL
hsl(223, 41%, 42%)
HSB
hsb(223, 58%, 58%)
CMYK
cmyk(58%, 42%, 0%, 42%)
Oklch
oklch(46.8% 0.105 266.5)

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

#AFA84E

Autumn Sage · GoldenRod · Honey Gold

HEX
#AFA84E
RGB
rgb(175, 168, 78)
HSL
hsl(56, 38%, 50%)
HSB
hsb(56, 55%, 69%)
CMYK
cmyk(0%, 4%, 55%, 31%)
Oklch
oklch(71.9% 0.112 104.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#EDFFC0

Willow Green · Beige · Mint Green

HEX
#EDFFC0
RGB
rgb(237, 255, 192)
HSL
hsl(77, 100%, 88%)
HSB
hsb(77, 25%, 100%)
CMYK
cmyk(7%, 0%, 25%, 0%)
Oklch
oklch(97.1% 0.083 120.9)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1E3B7F
80631E

Analogous

1E6C80
1E3B7F
321E80

Triadic

1E3B7F
801E3B
3B801E

Split-Comp.

1E3B7F
80321E
6C801E

Tetradic

1E3B7F
801E6C
80631E
1E8032

Contrast Matrix WCAG 2.1 Contrast

1E3B7F
061D49
3F5795
AFA84E
EDFFC0
—
1.6
Fail
1.5
Fail
4.3
AA Large
9.9
AAA
1.6
Fail
—
2.4
Fail
6.7
AA
15.4
AAA
1.5
Fail
2.4
Fail
—
2.8
Fail
6.5
AA
4.3
AA Large
6.7
AA
2.8
Fail
—
2.3
Fail
9.9
AAA
15.4
AAA
6.5
AA
2.3
Fail
—
White BG
10.6AAA
16.4AAA
7.0AA
2.5Fail
1.1Fail
Black BG
2.0Fail
1.3Fail
3.0AA Large
8.5AAA
19.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B6F
10103E
494A86
ACAC64
F5F5CF

Deuteranopia

29276B
0F0D3C
484682
ACAD69
F4F2D3

Tritanopia

1F625F
073634
407A78
AF7579
EEDBDE

Achromatopsia

3A3A3A
1B1B1B
575757
A0A0A0
F2F2F2

Shades & Tints Shades & Tints

#1E3B7F

Dark
Light

#061D49

Dark
Light

#3F5795

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1e3b7f;
  --color-2: #061d49;
  --color-3: #3f5795;
  --color-4: #afa84e;
  --color-5: #edffc0;
}

SCSS

$color-1: #1e3b7f;
$color-2: #061d49;
$color-3: #3f5795;
$color-4: #afa84e;
$color-5: #edffc0;

TAILWIND

colors: {
  'brand-1': '#1e3b7f',
  'brand-2': '#061d49',
  'brand-3': '#3f5795',
  'brand-4': '#afa84e',
  'brand-5': '#edffc0',
}

RGB Array

[30, 59, 127], [6, 29, 73], [63, 87, 149], [175, 168, 78], [237, 255, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1E3B7F, #061D49, #3F5795, #AFA84E, #EDFFC0 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #1e3b7f; --color-2: #061d49; --color-3: #3f5795; --color-4: #afa84e; --color-5: #edffc0. 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 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