← Back to Editor

#054C5E · #4CA086 · #C0E0BB · #62A38D · #425563

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#054C5E

Lake Blue · DarkSlateGray · Peacock Green

HEX
#054C5E
RGB
rgb(5, 76, 94)
HSL
hsl(192, 90%, 19%)
HSB
hsb(192, 95%, 37%)
CMYK
cmyk(95%, 19%, 0%, 63%)
Oklch
oklch(38.6% 0.069 221.3)

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

#4CA086

Mineral Blue · CadetBlue · Mint Ice

HEX
#4CA086
RGB
rgb(76, 160, 134)
HSL
hsl(161, 36%, 46%)
HSB
hsb(161, 53%, 63%)
CMYK
cmyk(52%, 0%, 16%, 37%)
Oklch
oklch(64.6% 0.092 170.6)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#C0E0BB

Celadon · Silver · Mint Green

HEX
#C0E0BB
RGB
rgb(192, 224, 187)
HSL
hsl(112, 37%, 81%)
HSB
hsb(112, 17%, 88%)
CMYK
cmyk(14%, 0%, 17%, 12%)
Oklch
oklch(87.4% 0.061 141.3)

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

#62A38D

Mineral Blue · CadetBlue · Lake Green

HEX
#62A38D
RGB
rgb(98, 163, 141)
HSL
hsl(160, 26%, 51%)
HSB
hsb(160, 40%, 64%)
CMYK
cmyk(40%, 0%, 13%, 36%)
Oklch
oklch(66.5% 0.075 170.3)

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

#425563

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#425563
RGB
rgb(66, 85, 99)
HSL
hsl(205, 20%, 32%)
HSB
hsb(205, 33%, 39%)
CMYK
cmyk(33%, 14%, 0%, 61%)
Oklch
oklch(43.9% 0.033 240.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

054C5E
5C1605

Analogous

055C42
054C5E
051F5C

Triadic

054C5E
5C054B
4B5C05

Split-Comp.

054C5E
5C051F
5C4205

Tetradic

054C5E
42055C
5C1605
1F5C05

Contrast Matrix WCAG 2.1 Contrast

054C5E
4CA086
C0E0BB
62A38D
425563
—
3.0
AA Large
6.6
AA
3.2
AA Large
1.2
Fail
3.0
AA Large
—
2.2
Fail
1.1
Fail
2.5
Fail
6.6
AA
2.2
Fail
—
2.0
Fail
5.4
AA
3.2
AA Large
1.1
Fail
2.0
Fail
—
2.6
Fail
1.2
Fail
2.5
Fail
5.4
AA
2.6
Fail
—
White BG
9.5AAA
3.1AA Large
1.4Fail
2.9Fail
7.7AAA
Black BG
2.2Fail
6.7AA
14.6AAA
7.1AAA
2.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

24245A
70718C
CECEC4
7E7F92
4A4A60

Deuteranopia

201A59
6C658E
CCCAC6
7A7694
49485F

Tritanopia

095655
509192
C2CBCD
659797
435D5C

Achromatopsia

393939
848484
D2D2D2
8D8D8D
515151

Shades & Tints Shades & Tints

#054C5E

Dark
Light

#4CA086

Dark
Light

#C0E0BB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #054c5e;
  --color-2: #4ca086;
  --color-3: #c0e0bb;
  --color-4: #62a38d;
  --color-5: #425563;
}

SCSS

$color-1: #054c5e;
$color-2: #4ca086;
$color-3: #c0e0bb;
$color-4: #62a38d;
$color-5: #425563;

TAILWIND

colors: {
  'brand-1': '#054c5e',
  'brand-2': '#4ca086',
  'brand-3': '#c0e0bb',
  'brand-4': '#62a38d',
  'brand-5': '#425563',
}

RGB Array

[5, 76, 94], [76, 160, 134], [192, 224, 187], [98, 163, 141], [66, 85, 99]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #054C5E, #4CA086, #C0E0BB, #62A38D, #425563 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: #054c5e; --color-2: #4ca086; --color-3: #c0e0bb; --color-4: #62a38d; --color-5: #425563. 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