← Back to Editor

#004A72 · #19310F · #498639 · #86CA65 · #1AF5F9

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#004A72

Lake Blue · MidnightBlue · Prussian Blue

HEX
#004A72
RGB
rgb(0, 74, 114)
HSL
hsl(201, 100%, 22%)
HSB
hsb(201, 100%, 45%)
CMYK
cmyk(100%, 35%, 0%, 55%)
Oklch
oklch(39.2% 0.092 241.6)

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

#19310F

Pine Green · Black · Dark Green

HEX
#19310F
RGB
rgb(25, 49, 15)
HSL
hsl(102, 53%, 13%)
HSB
hsb(102, 69%, 19%)
CMYK
cmyk(49%, 0%, 69%, 81%)
Oklch
oklch(28.4% 0.064 137.5)

Traditional「Pine Green」· Paint「Dark Green」· Creative Blush Sunrise

#498639

Celadon · DarkOliveGreen · Forest Green

HEX
#498639
RGB
rgb(73, 134, 57)
HSL
hsl(108, 40%, 37%)
HSB
hsb(108, 57%, 53%)
CMYK
cmyk(46%, 0%, 57%, 47%)
Oklch
oklch(56.1% 0.127 139.5)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#86CA65

Celadon · DarkSeaGreen · Olive Green

HEX
#86CA65
RGB
rgb(134, 202, 101)
HSL
hsl(100, 49%, 59%)
HSB
hsb(100, 50%, 79%)
CMYK
cmyk(34%, 0%, 50%, 21%)
Oklch
oklch(77.1% 0.151 136.3)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#1AF5F9

Lake Blue · Cyan · Lake Green

HEX
#1AF5F9
RGB
rgb(26, 245, 249)
HSL
hsl(181, 95%, 54%)
HSB
hsb(181, 90%, 98%)
CMYK
cmyk(90%, 2%, 0%, 2%)
Oklch
oklch(88.1% 0.148 197.0)

Traditional「Lake Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

004A72
702700

Analogous

00705F
004A72
001170

Triadic

004A72
700049
497000

Split-Comp.

004A72
700011
705F00

Tetradic

004A72
5F0070
702700
117000

Contrast Matrix WCAG 2.1 Contrast

004A72
19310F
498639
86CA65
1AF5F9
—
1.5
Fail
2.1
Fail
4.8
AA
7.0
AA
1.5
Fail
—
3.2
AA Large
7.2
AAA
10.4
AAA
2.1
Fail
3.2
AA Large
—
2.2
Fail
3.3
AA Large
4.8
AA
7.2
AAA
2.2
Fail
—
1.5
Fail
7.0
AA
10.4
AAA
3.3
AA Large
1.5
Fail
—
White BG
9.4AAA
14.1AAA
4.4AA Large
2.0Fail
1.4Fail
Black BG
2.2Fail
1.5Fail
4.8AA
10.6AAA
15.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

202168
232417
63644C
A3A47D
797BF8

Deuteranopia

1C1666
222019
605B50
A09A83
6C5CF8

Tritanopia

04615F
1A1E1F
4C5A5E
899195
25F7F7

Achromatopsia

383838
262626
6B6B6B
AAAAAA
B4B4B4

Shades & Tints Shades & Tints

#004A72

Dark
Light

#19310F

Dark
Light

#498639

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #004a72;
  --color-2: #19310f;
  --color-3: #498639;
  --color-4: #86ca65;
  --color-5: #1af5f9;
}

SCSS

$color-1: #004a72;
$color-2: #19310f;
$color-3: #498639;
$color-4: #86ca65;
$color-5: #1af5f9;

TAILWIND

colors: {
  'brand-1': '#004a72',
  'brand-2': '#19310f',
  'brand-3': '#498639',
  'brand-4': '#86ca65',
  'brand-5': '#1af5f9',
}

RGB Array

[0, 74, 114], [25, 49, 15], [73, 134, 57], [134, 202, 101], [26, 245, 249]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #004A72, #19310F, #498639, #86CA65, #1AF5F9 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #004a72; --color-2: #19310f; --color-3: #498639; --color-4: #86ca65; --color-5: #1af5f9. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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