#2A0F65 + #22427F + #359096 + #50B491 + #7AD172 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#2A0F65

Deep Indigo · MidnightBlue · Prussian Blue

HEX

#2A0F65

RGB

rgb(42, 15, 101)

HSL

hsl(259, 74%, 23%)

HSB

hsb(259, 85%, 40%)

CMYK

cmyk(58%, 85%, 0%, 60%)

Oklch

oklch(27.7% 0.136 288.2)

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

#22427F

Indigo · DarkSlateBlue · Prussian Blue

HEX

#22427F

RGB

rgb(34, 66, 127)

HSL

hsl(219, 58%, 32%)

HSB

hsb(219, 73%, 50%)

CMYK

cmyk(73%, 48%, 0%, 50%)

Oklch

oklch(39.0% 0.110 261.9)

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

#359096

Slate Blue · SteelBlue · Mint Ice

HEX

#359096

RGB

rgb(53, 144, 150)

HSL

hsl(184, 48%, 40%)

HSB

hsb(184, 65%, 59%)

CMYK

cmyk(65%, 4%, 0%, 41%)

Oklch

oklch(60.3% 0.085 201.3)

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

#50B491

Mineral Blue · CadetBlue · Olive Green

HEX

#50B491

RGB

rgb(80, 180, 145)

HSL

hsl(159, 40%, 51%)

HSB

hsb(159, 56%, 71%)

CMYK

cmyk(56%, 0%, 19%, 29%)

Oklch

oklch(70.0% 0.108 167.5)

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

#7AD172

Emerald · DarkSeaGreen · Apple Green

HEX

#7AD172

RGB

rgb(122, 209, 114)

HSL

hsl(115, 51%, 63%)

HSB

hsb(115, 45%, 82%)

CMYK

cmyk(42%, 0%, 45%, 18%)

Oklch

oklch(78.3% 0.155 142.2)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A0F65

4B660F

Analogous

0F1F66

2A0F65

560F66

Triadic

2A0F65

662B0F

0F662B

Split-Comp.

2A0F65

66560F

1F660F

Tetradic

2A0F65

660F1F

4B660F

0F6656

Contrast Matrix WCAG 2.1 Contrast

2A0F65	22427F	359096	50B491	7AD172
—	1.6 Fail	4.1 AA Large	6.1 AA	8.3 AAA
1.6 Fail	—	2.6 Fail	3.8 AA Large	5.2 AA
4.1 AA Large	2.6 Fail	—	1.5 Fail	2.0 Fail
6.1 AA	3.8 AA Large	1.5 Fail	—	1.4 Fail
8.3 AAA	5.2 AA	2.0 Fail	1.4 Fail	—

White BG

15.5AAA

9.8AAA

3.8AA Large

2.5Fail

1.9Fail

Black BG

1.4Fail

2.2Fail

5.6AA

8.3AAA

11.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1E1E50

303070

5C5D95

7B7C99

A0A089

Deuteranopia

20224B

2E2C6D

575094

766E9C

9B948F

Tritanopia

29403C

246562

3A9393

55A0A2

7E9B9F

Achromatopsia

212121

3F3F3F

757575

929292

ACACAC

Shades & Tints Shades & Tints

#2A0F65

Dark

Light

#22427F

Dark

Light

#359096

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a0f65;
  --color-2: #22427f;
  --color-3: #359096;
  --color-4: #50b491;
  --color-5: #7ad172;
}

SCSS

$color-1: #2a0f65;
$color-2: #22427f;
$color-3: #359096;
$color-4: #50b491;
$color-5: #7ad172;

TAILWIND

colors: {
  'brand-1': '#2a0f65',
  'brand-2': '#22427f',
  'brand-3': '#359096',
  'brand-4': '#50b491',
  'brand-5': '#7ad172',
}

RGB Array

[42, 15, 101], [34, 66, 127], [53, 144, 150], [80, 180, 145], [122, 209, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2A0F65, #22427F, #359096, #50B491, #7AD172 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: #2a0f65; --color-2: #22427f; --color-3: #359096; --color-4: #50b491; --color-5: #7ad172. 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