#431E65 + #334975 + #489884 + #A6BC49 + #1C0939 · earth - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#431E65

Royal Purple · MidnightBlue · Eggplant

HEX

#431E65

RGB

rgb(67, 30, 101)

HSL

hsl(271, 54%, 26%)

HSB

hsb(271, 70%, 40%)

CMYK

cmyk(34%, 70%, 0%, 60%)

Oklch

oklch(32.7% 0.120 304.4)

Traditional「Royal Purple」· Paint「Eggplant」· Creative Blush Sunrise

#334975

Indigo · DarkSlateBlue · Prussian Blue

HEX

#334975

RGB

rgb(51, 73, 117)

HSL

hsl(220, 39%, 33%)

HSB

hsb(220, 56%, 46%)

CMYK

cmyk(56%, 38%, 0%, 54%)

Oklch

oklch(40.9% 0.079 263.2)

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

#489884

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#489884

RGB

rgb(72, 152, 132)

HSL

hsl(165, 36%, 44%)

HSB

hsb(165, 53%, 60%)

CMYK

cmyk(53%, 0%, 13%, 40%)

Oklch

oklch(62.3% 0.085 174.8)

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

#A6BC49

Grass Green · GoldenRod · Olive Green

HEX

#A6BC49

RGB

rgb(166, 188, 73)

HSL

hsl(71, 46%, 51%)

HSB

hsb(71, 61%, 74%)

CMYK

cmyk(12%, 0%, 61%, 26%)

Oklch

oklch(75.6% 0.142 119.1)

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

#1C0939

Deep Indigo · MidnightBlue · Dark Purple

HEX

#1C0939

RGB

rgb(28, 9, 57)

HSL

hsl(264, 73%, 13%)

HSB

hsb(264, 84%, 22%)

CMYK

cmyk(51%, 84%, 0%, 78%)

Oklch

oklch(20.5% 0.087 295.8)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

431E65

41661E

Analogous

201E66

431E65

661E65

Triadic

431E65

66431E

1E6643

Split-Comp.

431E65

65661E

1E6620

Tetradic

431E65

66201E

41661E

1E6566

Contrast Matrix WCAG 2.1 Contrast

431E65	334975	489884	A6BC49	1C0939
—	1.5 Fail	3.8 AA Large	6.1 AA	1.4 Fail
1.5 Fail	—	2.6 Fail	4.2 AA Large	2.0 Fail
3.8 AA Large	2.6 Fail	—	1.6 Fail	5.3 AA
6.1 AA	4.2 AA Large	1.6 Fail	—	8.6 AAA
1.4 Fail	2.0 Fail	5.3 AA	8.6 AAA	—

White BG

13.0AAA

8.9AAA

3.4AA Large

2.1Fail

18.3AAA

Black BG

1.6Fail

2.4Fail

6.1AA

9.9AAA

1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

333354

3D3D6A

6B6B89

B0B065

14142D

Deuteranopia

353850

3B3A68

66608A

AEAD6C

15162B

Tritanopia

414643

346260

4C8D8E

A77B80

1B2422

Achromatopsia

313131

474747

7E7E7E

A8A8A8

141414

Shades & Tints Shades & Tints

#431E65

Dark

Light

#334975

Dark

Light

#489884

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #431e65;
  --color-2: #334975;
  --color-3: #489884;
  --color-4: #a6bc49;
  --color-5: #1c0939;
}

SCSS

$color-1: #431e65;
$color-2: #334975;
$color-3: #489884;
$color-4: #a6bc49;
$color-5: #1c0939;

TAILWIND

colors: {
  'brand-1': '#431e65',
  'brand-2': '#334975',
  'brand-3': '#489884',
  'brand-4': '#a6bc49',
  'brand-5': '#1c0939',
}

RGB Array

[67, 30, 101], [51, 73, 117], [72, 152, 132], [166, 188, 73], [28, 9, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #431E65, #334975, #489884, #A6BC49, #1C0939 is ideal for: tech websites, dark mode UIs, game UIs. 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: #431e65; --color-2: #334975; --color-3: #489884; --color-4: #a6bc49; --color-5: #1c0939. 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. 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 earth-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