#602B3B + #961E37 + #71A567 + #428F7B + #386B6E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#602B3B

Dark Violet · DarkSlateGray · Camellia

HEX

#602B3B

RGB

rgb(96, 43, 59)

HSL

hsl(342, 38%, 27%)

HSB

hsb(342, 55%, 38%)

CMYK

cmyk(0%, 55%, 39%, 62%)

Oklch

oklch(36.7% 0.079 2.7)

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

#961E37

Vermilion · Brown · Wine Red

HEX

#961E37

RGB

rgb(150, 30, 55)

HSL

hsl(348, 67%, 35%)

HSB

hsb(348, 80%, 59%)

CMYK

cmyk(0%, 80%, 63%, 41%)

Oklch

oklch(44.5% 0.154 15.1)

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

#71A567

Celadon · Gray · Olive Green

HEX

#71A567

RGB

rgb(113, 165, 103)

HSL

hsl(110, 26%, 53%)

HSB

hsb(110, 38%, 65%)

CMYK

cmyk(32%, 0%, 38%, 35%)

Oklch

oklch(66.9% 0.105 140.5)

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

#428F7B

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#428F7B

RGB

rgb(66, 143, 123)

HSL

hsl(164, 37%, 41%)

HSB

hsb(164, 54%, 56%)

CMYK

cmyk(54%, 0%, 14%, 44%)

Oklch

oklch(59.5% 0.083 174.0)

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

#386B6E

Slate Blue · SeaGreen · Mint Ice

HEX

#386B6E

RGB

rgb(56, 107, 110)

HSL

hsl(183, 33%, 33%)

HSB

hsb(183, 49%, 43%)

CMYK

cmyk(49%, 3%, 0%, 57%)

Oklch

oklch(49.4% 0.055 200.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

602B3B

2B5F4F

Analogous

5F2B55

602B3B

5F352B

Triadic

602B3B

3A5F2B

2B3A5F

Split-Comp.

602B3B

2B5F35

2B555F

Tetradic

602B3B

555F2B

2B5F4F

352B5F

Contrast Matrix WCAG 2.1 Contrast

602B3B	961E37	71A567	428F7B	386B6E
—	1.3 Fail	3.8 AA Large	2.9 Fail	1.8 Fail
1.3 Fail	—	2.9 Fail	2.1 Fail	1.4 Fail
3.8 AA Large	2.9 Fail	—	1.3 Fail	2.1 Fail
2.9 Fail	2.1 Fail	1.3 Fail	—	1.6 Fail
1.8 Fail	1.4 Fail	2.1 Fail	1.6 Fail	—

White BG

11.0AAA

8.3AAA

2.9Fail

3.9AA Large

6.0AA

Black BG

1.9Fail

2.5Fail

7.3AAA

5.4AA

3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

494937

626131

888876

636480

4E4F6D

Deuteranopia

4C5036

697230

85817A

5F5981

4B476D

Tritanopia

5D3433

902C2B

748284

468485

3B6D6D

Achromatopsia

3D3D3D

454545

8E8E8E

767676

5C5C5C

Shades & Tints Shades & Tints

#602B3B

Dark

Light

#961E37

Dark

Light

#71A567

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #602b3b;
  --color-2: #961e37;
  --color-3: #71a567;
  --color-4: #428f7b;
  --color-5: #386b6e;
}

SCSS

$color-1: #602b3b;
$color-2: #961e37;
$color-3: #71a567;
$color-4: #428f7b;
$color-5: #386b6e;

TAILWIND

colors: {
  'brand-1': '#602b3b',
  'brand-2': '#961e37',
  'brand-3': '#71a567',
  'brand-4': '#428f7b',
  'brand-5': '#386b6e',
}

RGB Array

[96, 43, 59], [150, 30, 55], [113, 165, 103], [66, 143, 123], [56, 107, 110]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #602B3B, #961E37, #71A567, #428F7B, #386B6E 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: #602b3b; --color-2: #961e37; --color-3: #71a567; --color-4: #428f7b; --color-5: #386b6e. 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