#319E85 + #3B5C5C + #412C3F + #431832 + #470023 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#319E85

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#319E85

RGB

rgb(49, 158, 133)

HSL

hsl(166, 53%, 41%)

HSB

hsb(166, 69%, 62%)

CMYK

cmyk(69%, 0%, 16%, 38%)

Oklch

oklch(63.2% 0.105 174.2)

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

#3B5C5C

Slate Blue · DarkSlateGray · Mint Ice

HEX

#3B5C5C

RGB

rgb(59, 92, 92)

HSL

hsl(180, 22%, 30%)

HSB

hsb(180, 36%, 36%)

CMYK

cmyk(36%, 0%, 0%, 64%)

Oklch

oklch(44.9% 0.038 195.9)

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

#412C3F

Rose Purple · DarkSlateGray · Eggplant

HEX

#412C3F

RGB

rgb(65, 44, 63)

HSL

hsl(306, 19%, 21%)

HSB

hsb(306, 32%, 25%)

CMYK

cmyk(0%, 32%, 3%, 75%)

Oklch

oklch(32.6% 0.044 329.8)

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

#431832

Rose Purple · DarkSlateGray · Raspberry

HEX

#431832

RGB

rgb(67, 24, 50)

HSL

hsl(324, 47%, 18%)

HSB

hsb(324, 64%, 26%)

CMYK

cmyk(0%, 64%, 25%, 74%)

Oklch

oklch(28.5% 0.075 345.7)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#470023

Dark Violet · Maroon · Raspberry

HEX

#470023

RGB

rgb(71, 0, 35)

HSL

hsl(330, 100%, 14%)

HSB

hsb(330, 100%, 28%)

CMYK

cmyk(0%, 100%, 51%, 72%)

Oklch

oklch(25.8% 0.105 358.4)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

319E85

A0314B

Analogous

31A04F

319E85

3182A0

Triadic

319E85

8631A0

A08631

Split-Comp.

319E85

A03182

A04F31

Tetradic

319E85

4F31A0

A0314B

82A031

Contrast Matrix WCAG 2.1 Contrast

319E85	3B5C5C	412C3F	431832	470023
—	2.2 Fail	3.8 AA Large	4.5 AA Large	4.9 AA
2.2 Fail	—	1.7 Fail	2.0 Fail	2.2 Fail
3.8 AA Large	1.7 Fail	—	1.2 Fail	1.3 Fail
4.5 AA Large	2.0 Fail	1.2 Fail	—	1.1 Fail
4.9 AA	2.2 Fail	1.3 Fail	1.1 Fail	—

White BG

3.3AA Large

7.3AAA

12.7AAA

14.8AAA

16.3AAA

Black BG

6.4AA

2.9Fail

1.7Fail

1.4Fail

1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

60618B

494A5C

38383A

30302C

28281B

Deuteranopia

5A528D

47455C

393B39

33362A

2C3219

Tritanopia

369091

3D5C5C

403736

412726

431412

Achromatopsia

7B7B7B

525252

343434

282828

191919

Shades & Tints Shades & Tints

#319E85

Dark

Light

#3B5C5C

Dark

Light

#412C3F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #319e85;
  --color-2: #3b5c5c;
  --color-3: #412c3f;
  --color-4: #431832;
  --color-5: #470023;
}

SCSS

$color-1: #319e85;
$color-2: #3b5c5c;
$color-3: #412c3f;
$color-4: #431832;
$color-5: #470023;

TAILWIND

colors: {
  'brand-1': '#319e85',
  'brand-2': '#3b5c5c',
  'brand-3': '#412c3f',
  'brand-4': '#431832',
  'brand-5': '#470023',
}

RGB Array

[49, 158, 133], [59, 92, 92], [65, 44, 63], [67, 24, 50], [71, 0, 35]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #319E85, #3B5C5C, #412C3F, #431832, #470023 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: #319e85; --color-2: #3b5c5c; --color-3: #412c3f; --color-4: #431832; --color-5: #470023. 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