#32EAF4 + #3CBFBB + #459382 + #4F6849 + #583C10 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#32EAF4

Lake Blue · Turquoise · Lake Green

HEX

#32EAF4

RGB

rgb(50, 234, 244)

HSL

hsl(183, 90%, 58%)

HSB

hsb(183, 80%, 96%)

CMYK

cmyk(80%, 4%, 0%, 4%)

Oklch

oklch(85.6% 0.138 200.7)

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

#3CBFBB

Mineral Blue · MediumTurquoise · Mint Ice

HEX

#3CBFBB

RGB

rgb(60, 191, 187)

HSL

hsl(178, 52%, 49%)

HSB

hsb(178, 69%, 75%)

CMYK

cmyk(69%, 0%, 2%, 25%)

Oklch

oklch(73.5% 0.111 192.0)

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

#459382

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#459382

RGB

rgb(69, 147, 130)

HSL

hsl(167, 36%, 42%)

HSB

hsb(167, 53%, 58%)

CMYK

cmyk(53%, 0%, 12%, 42%)

Oklch

oklch(60.9% 0.082 177.2)

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

#4F6849

Celadon · DarkOliveGreen · Forest Green

HEX

#4F6849

RGB

rgb(79, 104, 73)

HSL

hsl(108, 18%, 35%)

HSB

hsb(108, 30%, 41%)

CMYK

cmyk(24%, 0%, 30%, 59%)

Oklch

oklch(48.8% 0.057 139.6)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#583C10

Ochre · DarkOliveGreen · Cinnamon

HEX

#583C10

RGB

rgb(88, 60, 16)

HSL

hsl(37, 69%, 20%)

HSB

hsb(37, 82%, 35%)

CMYK

cmyk(0%, 32%, 82%, 65%)

Oklch

oklch(38.0% 0.070 74.4)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

32EAF4

F43D34

Analogous

34F49E

32EAF4

348AF4

Triadic

32EAF4

F434EB

EBF434

Split-Comp.

32EAF4

F4348A

F49E34

Tetradic

32EAF4

9E34F4

F43D34

8AF434

Contrast Matrix WCAG 2.1 Contrast

32EAF4	3CBFBB	459382	4F6849	583C10
—	1.5 Fail	2.5 Fail	4.2 AA Large	6.9 AA
1.5 Fail	—	1.6 Fail	2.7 Fail	4.5 AA
2.5 Fail	1.6 Fail	—	1.7 Fail	2.8 Fail
4.2 AA Large	2.7 Fail	1.7 Fail	—	1.6 Fail
6.9 AA	4.5 AA	2.8 Fail	1.6 Fail	—

White BG

1.5Fail

2.2Fail

3.7AA Large

6.2AA

10.2AAA

Black BG

14.2AAA

9.4AAA

5.7AA

3.4AA Large

2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8283F2

7576BC

676786

5A5A51

4C4C1B

Deuteranopia

7769F1

6D63BC

625C87

585752

4E501D

Tritanopia

3BF0EF

43BDBD

49898A

505658

572325

Achromatopsia

B4B4B4

979797

7A7A7A

5D5D5D

3F3F3F

Shades & Tints Shades & Tints

#32EAF4

Dark

Light

#3CBFBB

Dark

Light

#459382

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #32eaf4;
  --color-2: #3cbfbb;
  --color-3: #459382;
  --color-4: #4f6849;
  --color-5: #583c10;
}

SCSS

$color-1: #32eaf4;
$color-2: #3cbfbb;
$color-3: #459382;
$color-4: #4f6849;
$color-5: #583c10;

TAILWIND

colors: {
  'brand-1': '#32eaf4',
  'brand-2': '#3cbfbb',
  'brand-3': '#459382',
  'brand-4': '#4f6849',
  'brand-5': '#583c10',
}

RGB Array

[50, 234, 244], [60, 191, 187], [69, 147, 130], [79, 104, 73], [88, 60, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #32EAF4, #3CBFBB, #459382, #4F6849, #583C10 is ideal for: corporate websites, product showcases, portfolios. 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: #32eaf4; --color-2: #3cbfbb; --color-3: #459382; --color-4: #4f6849; --color-5: #583c10. 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 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