← Back to Editor

#6AADA9 · #708E91 · #77707A · #7D5263 · #84344C

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6AADA9

Mineral Blue · CadetBlue · Lake Green

HEX
#6AADA9
RGB
rgb(106, 173, 169)
HSL
hsl(176, 29%, 55%)
HSB
hsb(176, 39%, 68%)
CMYK
cmyk(39%, 0%, 2%, 32%)
Oklch
oklch(70.2% 0.069 190.8)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#708E91

Slate Blue · LightSlateGray · Mint Ice

HEX
#708E91
RGB
rgb(112, 142, 145)
HSL
hsl(185, 13%, 50%)
HSB
hsb(185, 23%, 57%)
CMYK
cmyk(23%, 2%, 0%, 43%)
Oklch
oklch(62.5% 0.034 203.9)

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

#77707A

Ink Gray · Gray · Warm Gray

HEX
#77707A
RGB
rgb(119, 112, 122)
HSL
hsl(282, 4%, 46%)
HSB
hsb(282, 8%, 48%)
CMYK
cmyk(2%, 8%, 0%, 52%)
Oklch
oklch(55.5% 0.017 315.9)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#7D5263

Dark Violet · DimGray · Camellia

HEX
#7D5263
RGB
rgb(125, 82, 99)
HSL
hsl(336, 21%, 41%)
HSB
hsb(336, 34%, 49%)
CMYK
cmyk(0%, 34%, 21%, 51%)
Oklch
oklch(49.1% 0.062 354.3)

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

#84344C

Dark Violet · Brown · Camellia

HEX
#84344C
RGB
rgb(132, 52, 76)
HSL
hsl(342, 43%, 36%)
HSB
hsb(342, 61%, 52%)
CMYK
cmyk(0%, 61%, 42%, 48%)
Oklch
oklch(44.3% 0.112 4.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6AADA9
AE6B6F

Analogous

6BAE88
6AADA9
6B91AE

Triadic

6AADA9
A96BAE
AEA96B

Split-Comp.

6AADA9
AE6B91
AE886B

Tetradic

6AADA9
886BAE
AE6B6F
91AE6B

Contrast Matrix WCAG 2.1 Contrast

6AADA9
708E91
77707A
7D5263
84344C
—
1.4
Fail
1.9
Fail
2.5
Fail
3.2
AA Large
1.4
Fail
—
1.4
Fail
1.8
Fail
2.3
Fail
1.9
Fail
1.4
Fail
—
1.3
Fail
1.7
Fail
2.5
Fail
1.8
Fail
1.3
Fail
—
1.3
Fail
3.2
AA Large
2.3
Fail
1.7
Fail
1.3
Fail
—
White BG
2.6Fail
3.5AA Large
4.8AA
6.4AA
8.2AAA
Black BG
8.2AAA
6.0AA
4.4AA Large
3.3AA Large
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8788AA
7D7D90
747478
6A6A5F
616146

Deuteranopia

837EAA
7B7990
747577
6D705E
666C45

Tritanopia

6DABAB
719090
777675
7B5C5B
804241

Achromatopsia

999999
858585
737373
616161
4F4F4F

Shades & Tints Shades & Tints

#6AADA9

Dark
Light

#708E91

Dark
Light

#77707A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6aada9;
  --color-2: #708e91;
  --color-3: #77707a;
  --color-4: #7d5263;
  --color-5: #84344c;
}

SCSS

$color-1: #6aada9;
$color-2: #708e91;
$color-3: #77707a;
$color-4: #7d5263;
$color-5: #84344c;

TAILWIND

colors: {
  'brand-1': '#6aada9',
  'brand-2': '#708e91',
  'brand-3': '#77707a',
  'brand-4': '#7d5263',
  'brand-5': '#84344c',
}

RGB Array

[106, 173, 169], [112, 142, 145], [119, 112, 122], [125, 82, 99], [132, 52, 76]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6AADA9, #708E91, #77707A, #7D5263, #84344C is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #6aada9; --color-2: #708e91; --color-3: #77707a; --color-4: #7d5263; --color-5: #84344c. 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 general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Restrained colors convey professionalism and trust. 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