← Back to Editor

#54DEA8 · #7EB9A5 · #96A4A4 · #A29BA3 · #A895A3

sea

A 5-color sea 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

#54DEA8

Mineral Blue · MediumAquaMarine · Olive Green

HEX
#54DEA8
RGB
rgb(84, 222, 168)
HSL
hsl(157, 68%, 60%)
HSB
hsb(157, 62%, 87%)
CMYK
cmyk(62%, 0%, 24%, 13%)
Oklch
oklch(81.1% 0.143 163.8)

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

#7EB9A5

Jade · DarkSeaGreen · Lake Green

HEX
#7EB9A5
RGB
rgb(126, 185, 165)
HSL
hsl(160, 30%, 61%)
HSB
hsb(160, 32%, 73%)
CMYK
cmyk(32%, 0%, 11%, 27%)
Oklch
oklch(73.9% 0.068 171.2)

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

#96A4A4

Ash · DarkGray · Silver Sand

HEX
#96A4A4
RGB
rgb(150, 164, 164)
HSL
hsl(180, 7%, 62%)
HSB
hsb(180, 9%, 64%)
CMYK
cmyk(9%, 0%, 0%, 36%)
Oklch
oklch(70.8% 0.016 196.8)

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

#A29BA3

Ash · DarkGray · Silver Sand

HEX
#A29BA3
RGB
rgb(162, 155, 163)
HSL
hsl(293, 4%, 62%)
HSB
hsb(293, 5%, 64%)
CMYK
cmyk(1%, 5%, 0%, 36%)
Oklch
oklch(69.8% 0.014 321.9)

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

#A895A3

Mauve · DarkGray · Lilac Purple

HEX
#A895A3
RGB
rgb(168, 149, 163)
HSL
hsl(316, 10%, 62%)
HSB
hsb(316, 11%, 66%)
CMYK
cmyk(0%, 11%, 3%, 34%)
Oklch
oklch(69.1% 0.030 335.1)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

54DEA8
DE5489

Analogous

54DE64
54DEA8
54CEDE

Triadic

54DEA8
A954DE
DEA954

Split-Comp.

54DEA8
DE54CE
DE6454

Tetradic

54DEA8
6454DE
DE5489
CEDE54

Contrast Matrix WCAG 2.1 Contrast

54DEA8
7EB9A5
96A4A4
A29BA3
A895A3
—
1.3
Fail
1.5
Fail
1.6
Fail
1.7
Fail
1.3
Fail
—
1.2
Fail
1.2
Fail
1.3
Fail
1.5
Fail
1.2
Fail
—
1.1
Fail
1.1
Fail
1.6
Fail
1.2
Fail
1.1
Fail
—
1.0
Fail
1.7
Fail
1.3
Fail
1.1
Fail
1.0
Fail
—
White BG
1.7Fail
2.2Fail
2.6Fail
2.7Fail
2.8Fail
Black BG
12.4AAA
9.4AAA
8.1AAA
7.8AAA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9091B5
9898AA
9C9CA4
9F9FA1
A0A0A0

Deuteranopia

887DB8
9490AB
9B9AA4
9FA0A1
A1A29F

Tritanopia

5BBFC2
81AEAF
97A4A4
A2A09F
A79D9C

Achromatopsia

AFAFAF
A5A5A5
A0A0A0
9E9E9E
9C9C9C

Shades & Tints Shades & Tints

#54DEA8

Dark
Light

#7EB9A5

Dark
Light

#96A4A4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #54dea8;
  --color-2: #7eb9a5;
  --color-3: #96a4a4;
  --color-4: #a29ba3;
  --color-5: #a895a3;
}

SCSS

$color-1: #54dea8;
$color-2: #7eb9a5;
$color-3: #96a4a4;
$color-4: #a29ba3;
$color-5: #a895a3;

TAILWIND

colors: {
  'brand-1': '#54dea8',
  'brand-2': '#7eb9a5',
  'brand-3': '#96a4a4',
  'brand-4': '#a29ba3',
  'brand-5': '#a895a3',
}

RGB Array

[84, 222, 168], [126, 185, 165], [150, 164, 164], [162, 155, 163], [168, 149, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #54DEA8, #7EB9A5, #96A4A4, #A29BA3, #A895A3 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: #54dea8; --color-2: #7eb9a5; --color-3: #96a4a4; --color-4: #a29ba3; --color-5: #a895a3. 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