← Back to Editor

#635A6A · #423B47 · #7A8073 · #A7D1C7 · #C1E6DD

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 LibraryData Visualization

Color Details Color Details

#635A6A

Dark Plum · DimGray · Charcoal

HEX
#635A6A
RGB
rgb(99, 90, 106)
HSL
hsl(274, 8%, 38%)
HSB
hsb(274, 15%, 42%)
CMYK
cmyk(7%, 15%, 0%, 58%)
Oklch
oklch(48.2% 0.028 310.4)

Traditional「Dark Plum」· Paint「Charcoal」· Creative Midnight Shadow

#423B47

Dark Plum · DarkSlateGray · Dark Stone

HEX
#423B47
RGB
rgb(66, 59, 71)
HSL
hsl(275, 9%, 25%)
HSB
hsb(275, 17%, 28%)
CMYK
cmyk(7%, 17%, 0%, 72%)
Oklch
oklch(36.4% 0.022 311.2)

Traditional「Dark Plum」· Paint「Dark Stone」· Creative Midnight Shadow

#7A8073

Ink Gray · Gray · Warm Gray

HEX
#7A8073
RGB
rgb(122, 128, 115)
HSL
hsl(88, 5%, 48%)
HSB
hsb(88, 10%, 50%)
CMYK
cmyk(5%, 0%, 10%, 50%)
Oklch
oklch(59.1% 0.021 127.3)

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

#A7D1C7

Jade · LightSteelBlue · Lake Green

HEX
#A7D1C7
RGB
rgb(167, 209, 199)
HSL
hsl(166, 31%, 74%)
HSB
hsb(166, 20%, 82%)
CMYK
cmyk(20%, 0%, 5%, 18%)
Oklch
oklch(82.8% 0.046 179.0)

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

#C1E6DD

Jade · LightBlue · Glacier Blue

HEX
#C1E6DD
RGB
rgb(193, 230, 221)
HSL
hsl(165, 43%, 83%)
HSB
hsb(165, 16%, 90%)
CMYK
cmyk(16%, 0%, 4%, 10%)
Oklch
oklch(89.6% 0.041 179.0)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

635A6A
606959

Analogous

5A5969
635A6A
695968

Triadic

635A6A
696259
596962

Split-Comp.

635A6A
686959
59695A

Tetradic

635A6A
695A59
606959
596869

Contrast Matrix WCAG 2.1 Contrast

635A6A
423B47
7A8073
A7D1C7
C1E6DD
—
1.6
Fail
1.6
Fail
3.9
AA Large
4.9
AA
1.6
Fail
—
2.6
Fail
6.5
AA
8.0
AAA
1.6
Fail
2.6
Fail
—
2.4
Fail
3.0
AA Large
3.9
AA Large
6.5
AA
2.4
Fail
—
1.2
Fail
4.9
AA
8.0
AAA
3.0
AA Large
1.2
Fail
—
White BG
6.6AA
10.8AAA
4.1AA Large
1.7Fail
1.3Fail
Black BG
3.2AA Large
1.9Fail
5.2AA
12.6AAA
15.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5F5F66
3F3F44
7D7D76
B9BAC9
D1D1DF

Deuteranopia

606065
3F4043
7C7C77
B7B4CA
CFCCE0

Tritanopia

636362
424241
7A7979
A9CBCC
C3E1E1

Achromatopsia

5F5F5F
3E3E3E
7D7D7D
C3C3C3
DADADA

Shades & Tints Shades & Tints

#635A6A

Dark
Light

#423B47

Dark
Light

#7A8073

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #635a6a;
  --color-2: #423b47;
  --color-3: #7a8073;
  --color-4: #a7d1c7;
  --color-5: #c1e6dd;
}

SCSS

$color-1: #635a6a;
$color-2: #423b47;
$color-3: #7a8073;
$color-4: #a7d1c7;
$color-5: #c1e6dd;

TAILWIND

colors: {
  'brand-1': '#635a6a',
  'brand-2': '#423b47',
  'brand-3': '#7a8073',
  'brand-4': '#a7d1c7',
  'brand-5': '#c1e6dd',
}

RGB Array

[99, 90, 106], [66, 59, 71], [122, 128, 115], [167, 209, 199], [193, 230, 221]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #635A6A, #423B47, #7A8073, #A7D1C7, #C1E6DD is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #635a6a; --color-2: #423b47; --color-3: #7a8073; --color-4: #a7d1c7; --color-5: #c1e6dd. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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