#464E65 + #403553 + #AB3952 + #D85952 + #50643F - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#464E65

Indigo · DarkSlateGray · Prussian Blue

HEX

#464E65

RGB

rgb(70, 78, 101)

HSL

hsl(225, 18%, 34%)

HSB

hsb(225, 31%, 40%)

CMYK

cmyk(31%, 23%, 0%, 60%)

Oklch

oklch(42.6% 0.040 269.7)

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

#403553

Deep Indigo · DarkSlateGray · Eggplant

HEX

#403553

RGB

rgb(64, 53, 83)

HSL

hsl(262, 22%, 27%)

HSB

hsb(262, 36%, 33%)

CMYK

cmyk(23%, 36%, 0%, 67%)

Oklch

oklch(35.4% 0.053 300.6)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#AB3952

Crimson · Brown · Passion Red

HEX

#AB3952

RGB

rgb(171, 57, 82)

HSL

hsl(347, 50%, 45%)

HSB

hsb(347, 67%, 67%)

CMYK

cmyk(0%, 67%, 52%, 33%)

Oklch

oklch(51.5% 0.149 11.0)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#D85952

Vermilion · Tomato · Passion Red

HEX

#D85952

RGB

rgb(216, 89, 82)

HSL

hsl(3, 63%, 58%)

HSB

hsb(3, 62%, 85%)

CMYK

cmyk(0%, 59%, 62%, 15%)

Oklch

oklch(62.6% 0.161 26.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#50643F

Celadon · DarkOliveGreen · Forest Green

HEX

#50643F

RGB

rgb(80, 100, 63)

HSL

hsl(92, 23%, 32%)

HSB

hsb(92, 37%, 39%)

CMYK

cmyk(20%, 0%, 37%, 61%)

Oklch

oklch(47.6% 0.062 131.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

464E65

665F47

Analogous

475F66

464E65

4F4766

Triadic

464E65

66474F

4F6647

Split-Comp.

464E65

664F47

5F6647

Tetradic

464E65

66475F

665F47

47664F

Contrast Matrix WCAG 2.1 Contrast

464E65	403553	AB3952	D85952	50643F
—	1.4 Fail	1.4 Fail	2.2 Fail	1.3 Fail
1.4 Fail	—	1.9 Fail	3.0 Fail	1.7 Fail
1.4 Fail	1.9 Fail	—	1.6 Fail	1.1 Fail
2.2 Fail	3.0 Fail	1.6 Fail	—	1.7 Fail
1.3 Fail	1.7 Fail	1.1 Fail	1.7 Fail	—

White BG

8.3AAA

11.3AAA

6.1AA

3.8AA Large

6.5AA

Black BG

2.5Fail

1.9Fail

3.4AA Large

5.5AA

3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

494A5F

3B3B4C

7A794C

A1A054

595948

Deuteranopia

49485E

3C3D4A

80894B

A8B254

58564A

Tritanopia

465B5A

3F4645

A54746

D25555

514F51

Achromatopsia

4E4E4E

3C3C3C

5E5E5E

7E7E7E

5A5A5A

Shades & Tints Shades & Tints

#464E65

Dark

Light

#403553

Dark

Light

#AB3952

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #464e65;
  --color-2: #403553;
  --color-3: #ab3952;
  --color-4: #d85952;
  --color-5: #50643f;
}

SCSS

$color-1: #464e65;
$color-2: #403553;
$color-3: #ab3952;
$color-4: #d85952;
$color-5: #50643f;

TAILWIND

colors: {
  'brand-1': '#464e65',
  'brand-2': '#403553',
  'brand-3': '#ab3952',
  'brand-4': '#d85952',
  'brand-5': '#50643f',
}

RGB Array

[70, 78, 101], [64, 53, 83], [171, 57, 82], [216, 89, 82], [80, 100, 63]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #464E65, #403553, #AB3952, #D85952, #50643F 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: #464e65; --color-2: #403553; --color-3: #ab3952; --color-4: #d85952; --color-5: #50643f. 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 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