← Back to Editor

#7AD1DE · #4CBDCF · #1693A5 · #195E69 · #04262B

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 AppData Visualization

Color Details Color Details

#7AD1DE

Sky Blue · SkyBlue · Lake Green

HEX
#7AD1DE
RGB
rgb(122, 209, 222)
HSL
hsl(188, 60%, 67%)
HSB
hsb(188, 45%, 87%)
CMYK
cmyk(45%, 6%, 0%, 13%)
Oklch
oklch(81.1% 0.086 207.9)

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

#4CBDCF

Lake Blue · MediumTurquoise · Lake Green

HEX
#4CBDCF
RGB
rgb(76, 189, 207)
HSL
hsl(188, 58%, 55%)
HSB
hsb(188, 63%, 81%)
CMYK
cmyk(63%, 9%, 0%, 19%)
Oklch
oklch(74.1% 0.104 209.7)

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

#1693A5

Lake Blue · LightSeaGreen · Mint Ice

HEX
#1693A5
RGB
rgb(22, 147, 165)
HSL
hsl(188, 76%, 37%)
HSB
hsb(188, 87%, 65%)
CMYK
cmyk(87%, 11%, 0%, 35%)
Oklch
oklch(61.0% 0.102 210.5)

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

#195E69

Lake Blue · DarkSlateGray · Peacock Green

HEX
#195E69
RGB
rgb(25, 94, 105)
HSL
hsl(188, 62%, 25%)
HSB
hsb(188, 76%, 41%)
CMYK
cmyk(76%, 10%, 0%, 59%)
Oklch
oklch(44.5% 0.068 210.5)

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

#04262B

Lake Blue · Black · Peacock Green

HEX
#04262B
RGB
rgb(4, 38, 43)
HSL
hsl(188, 83%, 9%)
HSB
hsb(188, 91%, 17%)
CMYK
cmyk(91%, 12%, 0%, 83%)
Oklch
oklch(24.7% 0.039 209.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7AD1DE
DD8678

Analogous

78DDB8
7AD1DE
789DDD

Triadic

7AD1DE
DD78D0
D0DD78

Split-Comp.

7AD1DE
DD789D
DDB878

Tetradic

7AD1DE
B878DD
DD8678
9DDD78

Contrast Matrix WCAG 2.1 Contrast

7AD1DE
4CBDCF
1693A5
195E69
04262B
—
1.3
Fail
2.1
Fail
4.2
AA Large
9.1
AAA
1.3
Fail
—
1.6
Fail
3.3
AA Large
7.2
AAA
2.1
Fail
1.6
Fail
—
2.0
Fail
4.4
AA Large
4.2
AA Large
3.3
AA Large
2.0
Fail
—
2.2
Fail
9.1
AAA
7.2
AAA
4.4
AA Large
2.2
Fail
—
White BG
1.7Fail
2.2Fail
3.7AA Large
7.4AAA
15.9AAA
Black BG
12.0AAA
9.5AAA
5.8AA
2.8Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A0A0DB
7D7ECB
4C4DA1
373766
13132A

Deuteranopia

9B94DA
766ECA
453CA0
332E66
110E2A

Tritanopia

7ED8D8
52C7C6
1C9D9C
1C6464
062929

Achromatopsia

B8B8B8
9D9D9D
707070
4B4B4B
1C1C1C

Shades & Tints Shades & Tints

#7AD1DE

Dark
Light

#4CBDCF

Dark
Light

#1693A5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7ad1de;
  --color-2: #4cbdcf;
  --color-3: #1693a5;
  --color-4: #195e69;
  --color-5: #04262b;
}

SCSS

$color-1: #7ad1de;
$color-2: #4cbdcf;
$color-3: #1693a5;
$color-4: #195e69;
$color-5: #04262b;

TAILWIND

colors: {
  'brand-1': '#7ad1de',
  'brand-2': '#4cbdcf',
  'brand-3': '#1693a5',
  'brand-4': '#195e69',
  'brand-5': '#04262b',
}

RGB Array

[122, 209, 222], [76, 189, 207], [22, 147, 165], [25, 94, 105], [4, 38, 43]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #7AD1DE, #4CBDCF, #1693A5, #195E69, #04262B is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #7ad1de; --color-2: #4cbdcf; --color-3: #1693a5; --color-4: #195e69; --color-5: #04262b. 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 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