← Back to Editor

#232E52 · #34547D · #507A8A · #C2B99D · #B39D5D

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#232E52

Indigo · DarkSlateGray · Prussian Blue

HEX
#232E52
RGB
rgb(35, 46, 82)
HSL
hsl(226, 40%, 23%)
HSB
hsb(226, 57%, 32%)
CMYK
cmyk(57%, 44%, 0%, 68%)
Oklch
oklch(31.1% 0.066 269.4)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#34547D

Indigo · DarkSlateBlue · Prussian Blue

HEX
#34547D
RGB
rgb(52, 84, 125)
HSL
hsl(214, 41%, 35%)
HSB
hsb(214, 58%, 49%)
CMYK
cmyk(58%, 33%, 0%, 51%)
Oklch
oklch(44.1% 0.078 255.2)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#507A8A

Slate Blue · SlateGray · Mint Ice

HEX
#507A8A
RGB
rgb(80, 122, 138)
HSL
hsl(197, 27%, 43%)
HSB
hsb(197, 42%, 54%)
CMYK
cmyk(42%, 12%, 0%, 46%)
Oklch
oklch(55.5% 0.053 223.9)

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

#C2B99D

Ginger · Tan · Sunflower

HEX
#C2B99D
RGB
rgb(194, 185, 157)
HSL
hsl(45, 23%, 69%)
HSB
hsb(45, 19%, 76%)
CMYK
cmyk(0%, 5%, 19%, 24%)
Oklch
oklch(78.6% 0.040 92.3)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#B39D5D

Ginger · Tan · Sunflower

HEX
#B39D5D
RGB
rgb(179, 157, 93)
HSL
hsl(45, 36%, 53%)
HSB
hsb(45, 48%, 70%)
CMYK
cmyk(0%, 12%, 48%, 30%)
Oklch
oklch(70.1% 0.087 91.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

232E52
524723

Analogous

234652
232E52
302352

Triadic

232E52
52232E
2E5223

Split-Comp.

232E52
523023
465223

Tetradic

232E52
522346
524723
235230

Contrast Matrix WCAG 2.1 Contrast

232E52
34547D
507A8A
C2B99D
B39D5D
—
1.7
Fail
2.8
Fail
6.8
AA
5.0
AA
1.7
Fail
—
1.7
Fail
4.0
AA Large
2.9
Fail
2.8
Fail
1.7
Fail
—
2.4
Fail
1.8
Fail
6.8
AA
4.0
AA Large
2.4
Fail
—
1.4
Fail
5.0
AA
2.9
Fail
1.8
Fail
1.4
Fail
—
White BG
13.3AAA
7.7AAA
4.7AA
2.0Fail
2.7Fail
Black BG
1.6Fail
2.7Fail
4.5AA Large
10.7AAA
7.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

282849
424273
626386
BEBEA4
A9A96C

Deuteranopia

272647
403E71
605D85
BFBFA5
ABAC70

Tritanopia

244241
366B6A
528382
C2A9AA
B2797B

Achromatopsia

2F2F2F
4F4F4F
6F6F6F
B8B8B8
9C9C9C

Shades & Tints Shades & Tints

#232E52

Dark
Light

#34547D

Dark
Light

#507A8A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #232e52;
  --color-2: #34547d;
  --color-3: #507a8a;
  --color-4: #c2b99d;
  --color-5: #b39d5d;
}

SCSS

$color-1: #232e52;
$color-2: #34547d;
$color-3: #507a8a;
$color-4: #c2b99d;
$color-5: #b39d5d;

TAILWIND

colors: {
  'brand-1': '#232e52',
  'brand-2': '#34547d',
  'brand-3': '#507a8a',
  'brand-4': '#c2b99d',
  'brand-5': '#b39d5d',
}

RGB Array

[35, 46, 82], [52, 84, 125], [80, 122, 138], [194, 185, 157], [179, 157, 93]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #232E52, #34547D, #507A8A, #C2B99D, #B39D5D is ideal for: 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: #232e52; --color-2: #34547d; --color-3: #507a8a; --color-4: #c2b99d; --color-5: #b39d5d. 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 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