← Back to Editor

#87E7FF · #A8D1B8 · #47BEB8 · #D9C49E · #00CCFF

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#87E7FF

Sky Blue · LightSkyBlue · Glacier Blue

HEX
#87E7FF
RGB
rgb(135, 231, 255)
HSL
hsl(192, 100%, 76%)
HSB
hsb(192, 47%, 100%)
CMYK
cmyk(47%, 9%, 0%, 0%)
Oklch
oklch(87.7% 0.097 215.7)

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

#A8D1B8

Celadon · Silver · Apple Green

HEX
#A8D1B8
RGB
rgb(168, 209, 184)
HSL
hsl(143, 31%, 74%)
HSB
hsb(143, 20%, 82%)
CMYK
cmyk(20%, 0%, 12%, 18%)
Oklch
oklch(82.4% 0.056 158.2)

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

#47BEB8

Mineral Blue · MediumTurquoise · Lake Green

HEX
#47BEB8
RGB
rgb(71, 190, 184)
HSL
hsl(177, 48%, 51%)
HSB
hsb(177, 63%, 75%)
CMYK
cmyk(63%, 0%, 3%, 25%)
Oklch
oklch(73.4% 0.105 190.4)

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

#D9C49E

Goose Yellow · Tan · Warm Sun

HEX
#D9C49E
RGB
rgb(217, 196, 158)
HSL
hsl(39, 44%, 74%)
HSB
hsb(39, 27%, 85%)
CMYK
cmyk(0%, 10%, 27%, 15%)
Oklch
oklch(82.8% 0.056 82.3)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#00CCFF

Lake Blue · DeepSkyBlue · Mint Ice

HEX
#00CCFF
RGB
rgb(0, 204, 255)
HSL
hsl(192, 100%, 50%)
HSB
hsb(192, 100%, 100%)
CMYK
cmyk(100%, 20%, 0%, 0%)
Oklch
oklch(78.6% 0.148 224.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

87E7FF
FF9D85

Analogous

85FFDA
87E7FF
85A9FF

Triadic

87E7FF
FF85E7
E7FF85

Split-Comp.

87E7FF
FF85A9
FFDA85

Tetradic

87E7FF
DA85FF
FF9D85
A9FF85

Contrast Matrix WCAG 2.1 Contrast

87E7FF
A8D1B8
47BEB8
D9C49E
00CCFF
—
1.2
Fail
1.6
Fail
1.2
Fail
1.3
Fail
1.2
Fail
—
1.3
Fail
1.0
Fail
1.1
Fail
1.6
Fail
1.3
Fail
—
1.3
Fail
1.2
Fail
1.2
Fail
1.0
Fail
1.3
Fail
—
1.1
Fail
1.3
Fail
1.1
Fail
1.2
Fail
1.1
Fail
—
White BG
1.4Fail
1.7Fail
2.3Fail
1.7Fail
1.9Fail
Black BG
14.9AAA
12.5AAA
9.3AAA
12.3AAA
11.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B1B1F9
BABABE
7B7CB9
D0D0A7
585AF3

Deuteranopia

ABA4F8
B7B4BF
746BBA
D1D3A9
4D3DF0

Tritanopia

8CF5F4
AAC3C4
4DBBBB
D8AEB0
0AE9E7

Achromatopsia

CDCDCD
C2C2C2
9A9A9A
C6C6C6
959595

Shades & Tints Shades & Tints

#87E7FF

Dark
Light

#A8D1B8

Dark
Light

#47BEB8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #87e7ff;
  --color-2: #a8d1b8;
  --color-3: #47beb8;
  --color-4: #d9c49e;
  --color-5: #00ccff;
}

SCSS

$color-1: #87e7ff;
$color-2: #a8d1b8;
$color-3: #47beb8;
$color-4: #d9c49e;
$color-5: #00ccff;

TAILWIND

colors: {
  'brand-1': '#87e7ff',
  'brand-2': '#a8d1b8',
  'brand-3': '#47beb8',
  'brand-4': '#d9c49e',
  'brand-5': '#00ccff',
}

RGB Array

[135, 231, 255], [168, 209, 184], [71, 190, 184], [217, 196, 158], [0, 204, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #87E7FF, #A8D1B8, #47BEB8, #D9C49E, #00CCFF 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: #87e7ff; --color-2: #a8d1b8; --color-3: #47beb8; --color-4: #d9c49e; --color-5: #00ccff. 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