#122B32 + #1D4746 + #286965 + #805A3D + #593D23 · 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

#122B32

Slate Blue · DarkSlateGray · Peacock Green

HEX

#122B32

RGB

rgb(18, 43, 50)

HSL

hsl(193, 47%, 13%)

HSB

hsb(193, 64%, 20%)

CMYK

cmyk(64%, 14%, 0%, 80%)

Oklch

oklch(27.2% 0.033 218.3)

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

#1D4746

Mineral Blue · DarkSlateGray · Peacock Green

HEX

#1D4746

RGB

rgb(29, 71, 70)

HSL

hsl(179, 42%, 20%)

HSB

hsb(179, 59%, 28%)

CMYK

cmyk(59%, 0%, 1%, 72%)

Oklch

oklch(36.8% 0.047 193.2)

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

#286965

Mineral Blue · DarkSlateGray · Mint Ice

HEX

#286965

RGB

rgb(40, 105, 101)

HSL

hsl(176, 45%, 28%)

HSB

hsb(176, 62%, 41%)

CMYK

cmyk(62%, 0%, 4%, 59%)

Oklch

oklch(47.8% 0.066 189.6)

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

#805A3D

Tangerine · Sienna · Amber Brown

HEX

#805A3D

RGB

rgb(128, 90, 61)

HSL

hsl(26, 35%, 37%)

HSB

hsb(26, 52%, 50%)

CMYK

cmyk(0%, 30%, 52%, 50%)

Oklch

oklch(50.1% 0.066 57.9)

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

#593D23

Tangerine · DarkOliveGreen · Cinnamon

HEX

#593D23

RGB

rgb(89, 61, 35)

HSL

hsl(29, 44%, 24%)

HSB

hsb(29, 61%, 35%)

CMYK

cmyk(0%, 31%, 61%, 65%)

Oklch

oklch(38.6% 0.056 62.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

122B32

311812

Analogous

123128

122B32

121A31

Triadic

122B32

31122A

2A3112

Split-Comp.

122B32

31121A

312812

Tetradic

122B32

281231

311812

1A3112

Contrast Matrix WCAG 2.1 Contrast

122B32	1D4746	286965	805A3D	593D23
—	1.4 Fail	2.3 Fail	2.4 Fail	1.5 Fail
1.4 Fail	—	1.6 Fail	1.7 Fail	1.0 Fail
2.3 Fail	1.6 Fail	—	1.0 Fail	1.6 Fail
2.4 Fail	1.7 Fail	1.0 Fail	—	1.6 Fail
1.5 Fail	1.0 Fail	1.6 Fail	1.6 Fail	—

White BG

14.8AAA

10.3AAA

6.4AA

6.1AA

9.9AAA

Black BG

1.4Fail

2.0Fail

3.3AA Large

3.4AA Large

2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

1D1D30

2F3046

444566

706F44

4D4D29

Deuteranopia

1B1A30

2D2A46

403C66

727546

4F512B

Tritanopia

132F2F

1F4646

2B6767

7E4A4B

582E2F

Achromatopsia

242424

3A3A3A

555555

626262

424242

Shades & Tints Shades & Tints

#122B32

Dark

Light

#1D4746

Dark

Light

#286965

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #122b32;
  --color-2: #1d4746;
  --color-3: #286965;
  --color-4: #805a3d;
  --color-5: #593d23;
}

SCSS

$color-1: #122b32;
$color-2: #1d4746;
$color-3: #286965;
$color-4: #805a3d;
$color-5: #593d23;

TAILWIND

colors: {
  'brand-1': '#122b32',
  'brand-2': '#1d4746',
  'brand-3': '#286965',
  'brand-4': '#805a3d',
  'brand-5': '#593d23',
}

RGB Array

[18, 43, 50], [29, 71, 70], [40, 105, 101], [128, 90, 61], [89, 61, 35]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #122B32, #1D4746, #286965, #805A3D, #593D23 is ideal for: tech websites, dark mode UIs, game UIs. 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: #122b32; --color-2: #1d4746; --color-3: #286965; --color-4: #805a3d; --color-5: #593d23. 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. 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