← Back to Editor

#01BDD0 · #2DCBC2 · #57D8B4 · #85E5A7 · #B1F399

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#01BDD0

Lake Blue · DarkTurquoise · Mint Ice

HEX
#01BDD0
RGB
rgb(1, 189, 208)
HSL
hsl(186, 99%, 41%)
HSB
hsb(186, 100%, 82%)
CMYK
cmyk(100%, 9%, 0%, 18%)
Oklch
oklch(73.0% 0.125 207.5)

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

#2DCBC2

Mineral Blue · MediumTurquoise · Mint Ice

HEX
#2DCBC2
RGB
rgb(45, 203, 194)
HSL
hsl(177, 64%, 49%)
HSB
hsb(177, 78%, 80%)
CMYK
cmyk(78%, 0%, 4%, 20%)
Oklch
oklch(76.3% 0.124 188.9)

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

#57D8B4

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#57D8B4
RGB
rgb(87, 216, 180)
HSL
hsl(163, 62%, 59%)
HSB
hsb(163, 60%, 85%)
CMYK
cmyk(60%, 0%, 17%, 15%)
Oklch
oklch(80.1% 0.126 171.6)

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

#85E5A7

Emerald · LightGreen · Apple Green

HEX
#85E5A7
RGB
rgb(133, 229, 167)
HSL
hsl(141, 65%, 71%)
HSB
hsb(141, 42%, 90%)
CMYK
cmyk(42%, 0%, 27%, 10%)
Oklch
oklch(84.6% 0.127 154.4)

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

#B1F399

Emerald · LightGreen · Apple Green

HEX
#B1F399
RGB
rgb(177, 243, 153)
HSL
hsl(104, 79%, 78%)
HSB
hsb(104, 37%, 95%)
CMYK
cmyk(27%, 0%, 37%, 5%)
Oklch
oklch(89.9% 0.136 137.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

01BDD0
D01601

Analogous

01D07D
01BDD0
0154D0

Triadic

01BDD0
D001BB
BBD001

Split-Comp.

01BDD0
D00154
D07D01

Tetradic

01BDD0
7D01D0
D01601
54D001

Contrast Matrix WCAG 2.1 Contrast

01BDD0
2DCBC2
57D8B4
85E5A7
B1F399
—
1.1
Fail
1.3
Fail
1.5
Fail
1.8
Fail
1.1
Fail
—
1.1
Fail
1.3
Fail
1.5
Fail
1.3
Fail
1.1
Fail
—
1.2
Fail
1.4
Fail
1.5
Fail
1.3
Fail
1.2
Fail
—
1.2
Fail
1.8
Fail
1.5
Fail
1.4
Fail
1.2
Fail
—
White BG
2.3Fail
2.0Fail
1.8Fail
1.5Fail
1.3Fail
Black BG
9.2AAA
10.4AAA
11.9AAA
13.8AAA
16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5254CB
7173C4
8F90BD
AFAFB6
CECEAF

Deuteranopia

4839CA
685CC5
877EBF
A9A2BA
CAC5B4

Tritanopia

0AC8C7
35C6C6
5DC4C5
8AC2C4
B4C0C4

Achromatopsia

878787
9B9B9B
ADADAD
C1C1C1
D5D5D5

Shades & Tints Shades & Tints

#01BDD0

Dark
Light

#2DCBC2

Dark
Light

#57D8B4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #01bdd0;
  --color-2: #2dcbc2;
  --color-3: #57d8b4;
  --color-4: #85e5a7;
  --color-5: #b1f399;
}

SCSS

$color-1: #01bdd0;
$color-2: #2dcbc2;
$color-3: #57d8b4;
$color-4: #85e5a7;
$color-5: #b1f399;

TAILWIND

colors: {
  'brand-1': '#01bdd0',
  'brand-2': '#2dcbc2',
  'brand-3': '#57d8b4',
  'brand-4': '#85e5a7',
  'brand-5': '#b1f399',
}

RGB Array

[1, 189, 208], [45, 203, 194], [87, 216, 180], [133, 229, 167], [177, 243, 153]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #01BDD0, #2DCBC2, #57D8B4, #85E5A7, #B1F399 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #01bdd0; --color-2: #2dcbc2; --color-3: #57d8b4; --color-4: #85e5a7; --color-5: #b1f399. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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