← Back to Editor

#AADBEA · #7CB4C3 · #338FA8 · #166D88 · #024B54

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

#AADBEA

Sky Blue · LightBlue · Glacier Blue

HEX
#AADBEA
RGB
rgb(170, 219, 234)
HSL
hsl(194, 60%, 79%)
HSB
hsb(194, 27%, 92%)
CMYK
cmyk(27%, 6%, 0%, 8%)
Oklch
oklch(86.2% 0.055 218.5)

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

#7CB4C3

Sky Blue · MediumAquaMarine · Lake Green

HEX
#7CB4C3
RGB
rgb(124, 180, 195)
HSL
hsl(193, 37%, 63%)
HSB
hsb(193, 36%, 76%)
CMYK
cmyk(36%, 8%, 0%, 24%)
Oklch
oklch(73.6% 0.062 216.3)

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

#338FA8

Lake Blue · SteelBlue · Mint Ice

HEX
#338FA8
RGB
rgb(51, 143, 168)
HSL
hsl(193, 53%, 43%)
HSB
hsb(193, 70%, 66%)
CMYK
cmyk(70%, 15%, 0%, 34%)
Oklch
oklch(60.7% 0.092 219.4)

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

#166D88

Lake Blue · Teal · Mint Ice

HEX
#166D88
RGB
rgb(22, 109, 136)
HSL
hsl(194, 72%, 31%)
HSB
hsb(194, 84%, 53%)
CMYK
cmyk(84%, 20%, 0%, 47%)
Oklch
oklch(49.9% 0.087 224.5)

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

#024B54

Lake Blue · DarkSlateGray · Peacock Green

HEX
#024B54
RGB
rgb(2, 75, 84)
HSL
hsl(187, 95%, 17%)
HSB
hsb(187, 98%, 33%)
CMYK
cmyk(98%, 11%, 0%, 67%)
Oklch
oklch(37.8% 0.064 208.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AADBEA
EAB8A9

Analogous

A9EAD8
AADBEA
A9BAEA

Triadic

AADBEA
EAA9DB
DBEAA9

Split-Comp.

AADBEA
EAA9BA
EAD8A9

Tetradic

AADBEA
D8A9EA
EAB8A9
BAEAA9

Contrast Matrix WCAG 2.1 Contrast

AADBEA
7CB4C3
338FA8
166D88
024B54
—
1.5
Fail
2.5
Fail
3.9
AA Large
6.6
AA
1.5
Fail
—
1.6
Fail
2.6
Fail
4.3
AA Large
2.5
Fail
1.6
Fail
—
1.6
Fail
2.6
Fail
3.9
AA Large
2.6
Fail
1.6
Fail
—
1.7
Fail
6.6
AA
4.3
AA Large
2.6
Fail
1.7
Fail
—
White BG
1.5Fail
2.3Fail
3.7AA Large
5.9AA
9.8AAA
Black BG
14.0AAA
9.2AAA
5.6AA
3.6AA Large
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFC0E6
9495BF
5B5CA2
3C3C81
222252

Deuteranopia

BCB9E6
918DBF
564FA1
373080
1D1851

Tritanopia

ACE4E3
7FBDBC
389D9C
1A7C7B
065050

Achromatopsia

CECECE
A5A5A5
767676
565656
363636

Shades & Tints Shades & Tints

#AADBEA

Dark
Light

#7CB4C3

Dark
Light

#338FA8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aadbea;
  --color-2: #7cb4c3;
  --color-3: #338fa8;
  --color-4: #166d88;
  --color-5: #024b54;
}

SCSS

$color-1: #aadbea;
$color-2: #7cb4c3;
$color-3: #338fa8;
$color-4: #166d88;
$color-5: #024b54;

TAILWIND

colors: {
  'brand-1': '#aadbea',
  'brand-2': '#7cb4c3',
  'brand-3': '#338fa8',
  'brand-4': '#166d88',
  'brand-5': '#024b54',
}

RGB Array

[170, 219, 234], [124, 180, 195], [51, 143, 168], [22, 109, 136], [2, 75, 84]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #AADBEA, #7CB4C3, #338FA8, #166D88, #024B54 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #aadbea; --color-2: #7cb4c3; --color-3: #338fa8; --color-4: #166d88; --color-5: #024b54. 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. 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