← Back to Editor

#6C7080 · #8B9199 · #A3B5AD · #ADD19F · #C4E398

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6C7080

Indigo · SlateGray · Warm Gray

HEX
#6C7080
RGB
rgb(108, 112, 128)
HSL
hsl(228, 8%, 46%)
HSB
hsb(228, 16%, 50%)
CMYK
cmyk(16%, 13%, 0%, 50%)
Oklch
oklch(54.7% 0.025 274.4)

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

#8B9199

Ash · LightSlateGray · Silver Sand

HEX
#8B9199
RGB
rgb(139, 145, 153)
HSL
hsl(214, 6%, 57%)
HSB
hsb(214, 9%, 60%)
CMYK
cmyk(9%, 5%, 0%, 40%)
Oklch
oklch(65.4% 0.014 255.5)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#A3B5AD

Jade · DarkGray · Apple Green

HEX
#A3B5AD
RGB
rgb(163, 181, 173)
HSL
hsl(153, 11%, 67%)
HSB
hsb(153, 10%, 71%)
CMYK
cmyk(10%, 0%, 4%, 29%)
Oklch
oklch(75.7% 0.023 167.3)

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

#ADD19F

Celadon · DarkSeaGreen · Apple Green

HEX
#ADD19F
RGB
rgb(173, 209, 159)
HSL
hsl(103, 35%, 72%)
HSB
hsb(103, 24%, 82%)
CMYK
cmyk(17%, 0%, 24%, 18%)
Oklch
oklch(82.2% 0.078 137.0)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#C4E398

Willow Green · Khaki · Apple Green

HEX
#C4E398
RGB
rgb(196, 227, 152)
HSL
hsl(85, 57%, 74%)
HSB
hsb(85, 33%, 89%)
CMYK
cmyk(14%, 0%, 33%, 11%)
Oklch
oklch(87.5% 0.104 126.7)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6C7080
7F7B6C

Analogous

6C797F
6C7080
726C7F

Triadic

6C7080
7F6C70
707F6C

Split-Comp.

6C7080
7F726C
797F6C

Tetradic

6C7080
7F6C79
7F7B6C
6C7F72

Contrast Matrix WCAG 2.1 Contrast

6C7080
8B9199
A3B5AD
ADD19F
C4E398
—
1.5
Fail
2.3
Fail
2.9
Fail
3.5
AA Large
1.5
Fail
—
1.5
Fail
1.9
Fail
2.2
Fail
2.3
Fail
1.5
Fail
—
1.3
Fail
1.5
Fail
2.9
Fail
1.9
Fail
1.3
Fail
—
1.2
Fail
3.5
AA Large
2.2
Fail
1.5
Fail
1.2
Fail
—
White BG
4.9AA
3.2AA Large
2.1Fail
1.7Fail
1.4Fail
Black BG
4.3AA Large
6.6AA
9.8AAA
12.4AAA
14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6E6E7C
8E8E97
ABABAF
BDBDAB
D1D2AA

Deuteranopia

6E6D7B
8D8D97
AAA8AF
BBB8AE
D0CDAF

Tritanopia

6C7978
8B9695
A4B0B1
AFB5B7
C6B8BC

Achromatopsia

717171
909090
AFAFAF
C1C1C1
D1D1D1

Shades & Tints Shades & Tints

#6C7080

Dark
Light

#8B9199

Dark
Light

#A3B5AD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6c7080;
  --color-2: #8b9199;
  --color-3: #a3b5ad;
  --color-4: #add19f;
  --color-5: #c4e398;
}

SCSS

$color-1: #6c7080;
$color-2: #8b9199;
$color-3: #a3b5ad;
$color-4: #add19f;
$color-5: #c4e398;

TAILWIND

colors: {
  'brand-1': '#6c7080',
  'brand-2': '#8b9199',
  'brand-3': '#a3b5ad',
  'brand-4': '#add19f',
  'brand-5': '#c4e398',
}

RGB Array

[108, 112, 128], [139, 145, 153], [163, 181, 173], [173, 209, 159], [196, 227, 152]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #6C7080, #8B9199, #A3B5AD, #ADD19F, #C4E398 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: #6c7080; --color-2: #8b9199; --color-3: #a3b5ad; --color-4: #add19f; --color-5: #c4e398. 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 sea-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