← Back to Editor

#3BF8FF · #BFBFBF · #97F7E6 · #B0FCFF · #D9FBFC

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

#3BF8FF

Sky Blue · Turquoise · Lake Green

HEX
#3BF8FF
RGB
rgb(59, 248, 255)
HSL
hsl(182, 100%, 62%)
HSB
hsb(182, 77%, 100%)
CMYK
cmyk(77%, 3%, 0%, 0%)
Oklch
oklch(89.4% 0.142 198.8)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#BFBFBF

Silver Gray · Silver · Pearl Gray

HEX
#BFBFBF
RGB
rgb(191, 191, 191)
HSL
hsl(0, 0%, 75%)
HSB
hsb(0, 0%, 75%)
CMYK
cmyk(0%, 0%, 0%, 25%)
Oklch
oklch(80.5% 0.000 89.9)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#97F7E6

Jade · LightBlue · Glacier Blue

HEX
#97F7E6
RGB
rgb(151, 247, 230)
HSL
hsl(169, 86%, 78%)
HSB
hsb(169, 39%, 97%)
CMYK
cmyk(39%, 0%, 7%, 3%)
Oklch
oklch(91.2% 0.095 181.6)

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

#B0FCFF

Sky Blue · LightBlue · Glacier Blue

HEX
#B0FCFF
RGB
rgb(176, 252, 255)
HSL
hsl(182, 100%, 85%)
HSB
hsb(182, 31%, 100%)
CMYK
cmyk(31%, 1%, 0%, 0%)
Oklch
oklch(94.3% 0.074 199.1)

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

#D9FBFC

Sky Blue · Lavender · Glacier Blue

HEX
#D9FBFC
RGB
rgb(217, 251, 252)
HSL
hsl(182, 85%, 92%)
HSB
hsb(182, 14%, 99%)
CMYK
cmyk(14%, 0%, 0%, 1%)
Oklch
oklch(96.4% 0.035 198.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3BF8FF
FF443D

Analogous

3DFFA5
3BF8FF
3D98FF

Triadic

3BF8FF
FF3DF9
F9FF3D

Split-Comp.

3BF8FF
FF3D98
FFA53D

Tetradic

3BF8FF
A53DFF
FF443D
98FF3D

Contrast Matrix WCAG 2.1 Contrast

3BF8FF
BFBFBF
97F7E6
B0FCFF
D9FBFC
—
1.4
Fail
1.0
Fail
1.1
Fail
1.2
Fail
1.4
Fail
—
1.5
Fail
1.6
Fail
1.7
Fail
1.0
Fail
1.5
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
1.6
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.7
Fail
1.1
Fail
1.1
Fail
—
White BG
1.3Fail
1.8Fail
1.3Fail
1.2Fail
1.1Fail
Black BG
16.1AAA
11.4AAA
16.8AAA
18.2AAA
19.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8D8FFD
BFBFBF
C1C1EA
D1D2FE
E8E8FC

Deuteranopia

8274FD
BFBFBF
BBB4EB
CDC7FE
E6E3FC

Tritanopia

44FCFC
BFBFBF
9CEDEE
B4FEFE
DBFCFC

Achromatopsia

C0C0C0
BFBFBF
D8D8D8
E6E6E6
F1F1F1

Shades & Tints Shades & Tints

#3BF8FF

Dark
Light

#BFBFBF

Dark
Light

#97F7E6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3bf8ff;
  --color-2: #bfbfbf;
  --color-3: #97f7e6;
  --color-4: #b0fcff;
  --color-5: #d9fbfc;
}

SCSS

$color-1: #3bf8ff;
$color-2: #bfbfbf;
$color-3: #97f7e6;
$color-4: #b0fcff;
$color-5: #d9fbfc;

TAILWIND

colors: {
  'brand-1': '#3bf8ff',
  'brand-2': '#bfbfbf',
  'brand-3': '#97f7e6',
  'brand-4': '#b0fcff',
  'brand-5': '#d9fbfc',
}

RGB Array

[59, 248, 255], [191, 191, 191], [151, 247, 230], [176, 252, 255], [217, 251, 252]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #3BF8FF, #BFBFBF, #97F7E6, #B0FCFF, #D9FBFC is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. 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: #3bf8ff; --color-2: #bfbfbf; --color-3: #97f7e6; --color-4: #b0fcff; --color-5: #d9fbfc. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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