#515869 + #5C9099 + #3DBF9F + #2ADB88 + #0DFF41 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#515869

Indigo · DimGray · Prussian Blue

HEX

#515869

RGB

rgb(81, 88, 105)

HSL

hsl(222, 13%, 36%)

HSB

hsb(222, 23%, 41%)

CMYK

cmyk(23%, 16%, 0%, 59%)

Oklch

oklch(46.1% 0.029 267.6)

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

#5C9099

Slate Blue · CadetBlue · Mint Ice

HEX

#5C9099

RGB

rgb(92, 144, 153)

HSL

hsl(189, 25%, 48%)

HSB

hsb(189, 40%, 60%)

CMYK

cmyk(40%, 6%, 0%, 40%)

Oklch

oklch(62.0% 0.057 209.6)

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

#3DBF9F

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#3DBF9F

RGB

rgb(61, 191, 159)

HSL

hsl(165, 52%, 49%)

HSB

hsb(165, 68%, 75%)

CMYK

cmyk(68%, 0%, 17%, 25%)

Oklch

oklch(72.6% 0.122 172.9)

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

#2ADB88

Mineral Blue · MediumSeaGreen · Olive Green

HEX

#2ADB88

RGB

rgb(42, 219, 136)

HSL

hsl(152, 71%, 51%)

HSB

hsb(152, 81%, 86%)

CMYK

cmyk(81%, 0%, 38%, 14%)

Oklch

oklch(78.8% 0.180 156.3)

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

#0DFF41

Emerald · LimeGreen · Olive Green

HEX

#0DFF41

RGB

rgb(13, 255, 65)

HSL

hsl(133, 100%, 53%)

HSB

hsb(133, 95%, 100%)

CMYK

cmyk(95%, 0%, 75%, 0%)

Oklch

oklch(86.9% 0.277 144.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

515869

686150

Analogous

506368

515869

555068

Triadic

515869

685057

576850

Split-Comp.

515869

685550

636850

Tetradic

515869

685063

686150

506855

Contrast Matrix WCAG 2.1 Contrast

515869	5C9099	3DBF9F	2ADB88	0DFF41
—	2.0 Fail	3.1 AA Large	3.9 AA Large	5.2 AA
2.0 Fail	—	1.5 Fail	2.0 Fail	2.6 Fail
3.1 AA Large	1.5 Fail	—	1.3 Fail	1.7 Fail
3.9 AA Large	2.0 Fail	1.3 Fail	—	1.3 Fail
5.2 AA	2.6 Fail	1.7 Fail	1.3 Fail	—

White BG

7.1AAA

3.6AA Large

2.3Fail

1.8Fail

1.4Fail

Black BG

2.9Fail

5.9AA

9.2AAA

11.6AAA

15.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

545465

737397

7576A7

77789C

76786F

Deuteranopia

545364

706C96

6E64A9

6C5FA1

68567A

Tritanopia

516261

5F9595

44ADAE

33ACAF

19939B

Achromatopsia

585858

818181

949494

9D9D9D

A1A1A1

Shades & Tints Shades & Tints

#515869

Dark

Light

#5C9099

Dark

Light

#3DBF9F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #515869;
  --color-2: #5c9099;
  --color-3: #3dbf9f;
  --color-4: #2adb88;
  --color-5: #0dff41;
}

SCSS

$color-1: #515869;
$color-2: #5c9099;
$color-3: #3dbf9f;
$color-4: #2adb88;
$color-5: #0dff41;

TAILWIND

colors: {
  'brand-1': '#515869',
  'brand-2': '#5c9099',
  'brand-3': '#3dbf9f',
  'brand-4': '#2adb88',
  'brand-5': '#0dff41',
}

RGB Array

[81, 88, 105], [92, 144, 153], [61, 191, 159], [42, 219, 136], [13, 255, 65]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #515869, #5C9099, #3DBF9F, #2ADB88, #0DFF41 is ideal for: corporate websites, product showcases, portfolios. 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: #515869; --color-2: #5c9099; --color-3: #3dbf9f; --color-4: #2adb88; --color-5: #0dff41. 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 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