← Back to Editor

#4EE4BB · #2FC46C · #3A9C51 · #3C662D · #1C2720

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

#4EE4BB

Mineral Blue · Turquoise · Lake Green

HEX
#4EE4BB
RGB
rgb(78, 228, 187)
HSL
hsl(164, 74%, 60%)
HSB
hsb(164, 66%, 89%)
CMYK
cmyk(66%, 0%, 18%, 11%)
Oklch
oklch(82.9% 0.140 171.1)

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

#2FC46C

Pine Green · MediumSeaGreen · Olive Green

HEX
#2FC46C
RGB
rgb(47, 196, 108)
HSL
hsl(145, 61%, 48%)
HSB
hsb(145, 76%, 77%)
CMYK
cmyk(76%, 0%, 45%, 23%)
Oklch
oklch(72.4% 0.175 152.0)

Traditional「Pine Green」· Paint「Olive Green」· Creative Blush Sunrise

#3A9C51

Celadon · SeaGreen · Olive Green

HEX
#3A9C51
RGB
rgb(58, 156, 81)
HSL
hsl(134, 46%, 42%)
HSB
hsb(134, 63%, 61%)
CMYK
cmyk(63%, 0%, 48%, 39%)
Oklch
oklch(61.7% 0.144 148.3)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#3C662D

Celadon · DarkOliveGreen · Forest Green

HEX
#3C662D
RGB
rgb(60, 102, 45)
HSL
hsl(104, 39%, 29%)
HSB
hsb(104, 56%, 40%)
CMYK
cmyk(41%, 0%, 56%, 60%)
Oklch
oklch(46.5% 0.098 138.1)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#1C2720

Celadon · Black · Dark Green

HEX
#1C2720
RGB
rgb(28, 39, 32)
HSL
hsl(142, 16%, 13%)
HSB
hsb(142, 28%, 15%)
CMYK
cmyk(28%, 0%, 18%, 85%)
Oklch
oklch(26.0% 0.020 156.8)

Traditional「Celadon」· Paint「Dark Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4EE4BB
E44E76

Analogous

4EE471
4EE4BB
4EC1E4

Triadic

4EE4BB
BC4EE4
E4BC4E

Split-Comp.

4EE4BB
E44EC1
E4714E

Tetradic

4EE4BB
714EE4
E44E76
C1E44E

Contrast Matrix WCAG 2.1 Contrast

4EE4BB
2FC46C
3A9C51
3C662D
1C2720
—
1.4
Fail
2.2
Fail
4.2
AA Large
9.7
AAA
1.4
Fail
—
1.5
Fail
2.9
Fail
6.8
AA
2.2
Fail
1.5
Fail
—
1.9
Fail
4.5
AA Large
4.2
AA Large
2.9
Fail
1.9
Fail
—
2.3
Fail
9.7
AAA
6.8
AA
4.5
AA Large
2.3
Fail
—
White BG
1.6Fail
2.3Fail
3.5AA Large
6.7AA
15.4AAA
Black BG
13.1AAA
9.2AAA
6.1AA
3.1AA Large
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F90C5
707181
646563
4E4F3B
212122

Deuteranopia

867BC7
675C86
5F5768
4C493E
201F22

Tritanopia

56CDCE
369296
3F7175
3E4648
1D2323

Achromatopsia

B2B2B2
8D8D8D
767676
535353
232323

Shades & Tints Shades & Tints

#4EE4BB

Dark
Light

#2FC46C

Dark
Light

#3A9C51

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4ee4bb;
  --color-2: #2fc46c;
  --color-3: #3a9c51;
  --color-4: #3c662d;
  --color-5: #1c2720;
}

SCSS

$color-1: #4ee4bb;
$color-2: #2fc46c;
$color-3: #3a9c51;
$color-4: #3c662d;
$color-5: #1c2720;

TAILWIND

colors: {
  'brand-1': '#4ee4bb',
  'brand-2': '#2fc46c',
  'brand-3': '#3a9c51',
  'brand-4': '#3c662d',
  'brand-5': '#1c2720',
}

RGB Array

[78, 228, 187], [47, 196, 108], [58, 156, 81], [60, 102, 45], [28, 39, 32]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #4EE4BB, #2FC46C, #3A9C51, #3C662D, #1C2720 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #4ee4bb; --color-2: #2fc46c; --color-3: #3a9c51; --color-4: #3c662d; --color-5: #1c2720. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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. 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