#6B4D73 + #676B91 + #408D9E + #19AEAC + #A0D2B9 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6B4D73

Dark Plum · DimGray · Eggplant

HEX

#6B4D73

RGB

rgb(107, 77, 115)

HSL

hsl(287, 20%, 38%)

HSB

hsb(287, 33%, 45%)

CMYK

cmyk(7%, 33%, 0%, 55%)

Oklch

oklch(46.7% 0.070 319.0)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#676B91

Indigo · SlateGray · Navy Blue

HEX

#676B91

RGB

rgb(103, 107, 145)

HSL

hsl(234, 17%, 49%)

HSB

hsb(234, 29%, 57%)

CMYK

cmyk(29%, 26%, 0%, 43%)

Oklch

oklch(53.9% 0.060 279.5)

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

#408D9E

Slate Blue · SteelBlue · Mint Ice

HEX

#408D9E

RGB

rgb(64, 141, 158)

HSL

hsl(191, 42%, 44%)

HSB

hsb(191, 59%, 62%)

CMYK

cmyk(59%, 11%, 0%, 38%)

Oklch

oklch(60.2% 0.079 214.4)

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

#19AEAC

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#19AEAC

RGB

rgb(25, 174, 172)

HSL

hsl(179, 75%, 39%)

HSB

hsb(179, 86%, 68%)

CMYK

cmyk(86%, 0%, 1%, 32%)

Oklch

oklch(68.1% 0.113 193.3)

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

#A0D2B9

Jade · Silver · Apple Green

HEX

#A0D2B9

RGB

rgb(160, 210, 185)

HSL

hsl(150, 36%, 73%)

HSB

hsb(150, 24%, 82%)

CMYK

cmyk(24%, 0%, 12%, 18%)

Oklch

oklch(82.2% 0.063 162.9)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6B4D73

56744E

Analogous

594E74

6B4D73

744E69

Triadic

6B4D73

746C4E

4E746C

Split-Comp.

6B4D73

69744E

4E7459

Tetradic

6B4D73

74594E

56744E

4E6974

Contrast Matrix WCAG 2.1 Contrast

6B4D73	676B91	408D9E	19AEAC	A0D2B9
—	1.4 Fail	1.9 Fail	2.6 Fail	4.2 AA Large
1.4 Fail	—	1.4 Fail	1.9 Fail	3.0 AA Large
1.9 Fail	1.4 Fail	—	1.4 Fail	2.2 Fail
2.6 Fail	1.9 Fail	1.4 Fail	—	1.6 Fail
4.2 AA Large	3.0 AA Large	2.2 Fail	1.6 Fail	—

White BG

7.2AAA

5.1AA

3.8AA Large

2.7Fail

1.7Fail

Black BG

2.9Fail

4.1AA Large

5.5AA

7.7AAA

12.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5E5E6A

696988

61629A

5A5BAC

B6B6BF

Deuteranopia

606268

696886

5D5799

5146AD

B3AFC1

Tritanopia

696361

67817F

449796

20ADAD

A3C4C5

Achromatopsia

5A5A5A

6E6E6E

787878

818181

C0C0C0

Shades & Tints Shades & Tints

#6B4D73

Dark

Light

#676B91

Dark

Light

#408D9E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6b4d73;
  --color-2: #676b91;
  --color-3: #408d9e;
  --color-4: #19aeac;
  --color-5: #a0d2b9;
}

SCSS

$color-1: #6b4d73;
$color-2: #676b91;
$color-3: #408d9e;
$color-4: #19aeac;
$color-5: #a0d2b9;

TAILWIND

colors: {
  'brand-1': '#6b4d73',
  'brand-2': '#676b91',
  'brand-3': '#408d9e',
  'brand-4': '#19aeac',
  'brand-5': '#a0d2b9',
}

RGB Array

[107, 77, 115], [103, 107, 145], [64, 141, 158], [25, 174, 172], [160, 210, 185]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #6B4D73, #676B91, #408D9E, #19AEAC, #A0D2B9 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: #6b4d73; --color-2: #676b91; --color-3: #408d9e; --color-4: #19aeac; --color-5: #a0d2b9. 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 cool-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