← Back to Editor

#5AB1AD · #534840 · #DFDDA3 · #F5F5CF · #C7EBE3

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#5AB1AD

Mineral Blue · CadetBlue · Lake Green

HEX
#5AB1AD
RGB
rgb(90, 177, 173)
HSL
hsl(177, 36%, 52%)
HSB
hsb(177, 49%, 69%)
CMYK
cmyk(49%, 0%, 2%, 31%)
Oklch
oklch(70.5% 0.084 191.5)

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

#534840

Tangerine · DarkOliveGreen · Amber Brown

HEX
#534840
RGB
rgb(83, 72, 64)
HSL
hsl(25, 13%, 29%)
HSB
hsb(25, 23%, 33%)
CMYK
cmyk(0%, 13%, 23%, 67%)
Oklch
oklch(41.0% 0.020 58.2)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#DFDDA3

Fresh Green · Wheat · Lemon Cream

HEX
#DFDDA3
RGB
rgb(223, 221, 163)
HSL
hsl(58, 48%, 76%)
HSB
hsb(58, 27%, 87%)
CMYK
cmyk(0%, 1%, 27%, 13%)
Oklch
oklch(88.5% 0.075 106.2)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#F5F5CF

Fresh Green · Beige · Lemon Cream

HEX
#F5F5CF
RGB
rgb(245, 245, 207)
HSL
hsl(60, 66%, 89%)
HSB
hsb(60, 16%, 96%)
CMYK
cmyk(0%, 0%, 16%, 4%)
Oklch
oklch(96.0% 0.049 107.3)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#C7EBE3

Jade · LightGray · Glacier Blue

HEX
#C7EBE3
RGB
rgb(199, 235, 227)
HSL
hsl(167, 47%, 85%)
HSB
hsb(167, 15%, 92%)
CMYK
cmyk(15%, 0%, 3%, 8%)
Oklch
oklch(91.2% 0.039 180.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5AB1AD
B1595D

Analogous

59B180
5AB1AD
5989B1

Triadic

5AB1AD
AC59B1
B1AC59

Split-Comp.

5AB1AD
B15989
B18059

Tetradic

5AB1AD
8059B1
B1595D
89B159

Contrast Matrix WCAG 2.1 Contrast

5AB1AD
534840
DFDDA3
F5F5CF
C7EBE3
—
3.5
AA Large
1.8
Fail
2.3
Fail
2.0
Fail
3.5
AA Large
—
6.3
AA
8.0
AAA
6.9
AA
1.8
Fail
6.3
AA
—
1.3
Fail
1.1
Fail
2.3
Fail
8.0
AAA
1.3
Fail
—
1.1
Fail
2.0
Fail
6.9
AA
1.1
Fail
1.1
Fail
—
White BG
2.5Fail
8.9AAA
1.4Fail
1.1Fail
1.3Fail
Black BG
8.3AAA
2.4Fail
15.0AAA
18.8AAA
16.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8080AE
4E4E42
DEDEB1
F5F5D8
D7D7E5

Deuteranopia

7B74AE
4F5042
DEDEB4
F5F5DA
D5D2E5

Tritanopia

5EAFAF
524344
DFBCBF
F5DFE1
C9E6E7

Achromatopsia

979797
4A4A4A
D7D7D7
F1F1F1
DFDFDF

Shades & Tints Shades & Tints

#5AB1AD

Dark
Light

#534840

Dark
Light

#DFDDA3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5ab1ad;
  --color-2: #534840;
  --color-3: #dfdda3;
  --color-4: #f5f5cf;
  --color-5: #c7ebe3;
}

SCSS

$color-1: #5ab1ad;
$color-2: #534840;
$color-3: #dfdda3;
$color-4: #f5f5cf;
$color-5: #c7ebe3;

TAILWIND

colors: {
  'brand-1': '#5ab1ad',
  'brand-2': '#534840',
  'brand-3': '#dfdda3',
  'brand-4': '#f5f5cf',
  'brand-5': '#c7ebe3',
}

RGB Array

[90, 177, 173], [83, 72, 64], [223, 221, 163], [245, 245, 207], [199, 235, 227]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #5AB1AD, #534840, #DFDDA3, #F5F5CF, #C7EBE3 is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #5ab1ad; --color-2: #534840; --color-3: #dfdda3; --color-4: #f5f5cf; --color-5: #c7ebe3. 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. 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 tech, SaaS, healthcare, eco industries. 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