#2E5451 + #208760 + #929624 + #D58708 + #B3AE78 · 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

#2E5451

Mineral Blue · DarkSlateGray · Peacock Green

HEX

#2E5451

RGB

rgb(46, 84, 81)

HSL

hsl(175, 29%, 25%)

HSB

hsb(175, 45%, 33%)

CMYK

cmyk(45%, 0%, 4%, 67%)

Oklch

oklch(41.7% 0.044 189.1)

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

#208760

Mineral Blue · SeaGreen · Forest Green

HEX

#208760

RGB

rgb(32, 135, 96)

HSL

hsl(157, 62%, 33%)

HSB

hsb(157, 76%, 53%)

CMYK

cmyk(76%, 0%, 29%, 47%)

Oklch

oklch(55.6% 0.110 162.7)

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

#929624

Autumn Sage · Olive · Honey Gold

HEX

#929624

RGB

rgb(146, 150, 36)

HSL

hsl(62, 61%, 36%)

HSB

hsb(62, 76%, 59%)

CMYK

cmyk(3%, 0%, 76%, 41%)

Oklch

oklch(64.9% 0.131 111.6)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#D58708

Ochre · DarkGoldenRod · Amber Brown

HEX

#D58708

RGB

rgb(213, 135, 8)

HSL

hsl(37, 93%, 43%)

HSB

hsb(37, 96%, 84%)

CMYK

cmyk(0%, 37%, 96%, 16%)

Oklch

oklch(68.8% 0.148 69.0)

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

#B3AE78

Autumn Sage · Tan · Sunflower

HEX

#B3AE78

RGB

rgb(179, 174, 120)

HSL

hsl(55, 28%, 59%)

HSB

hsb(55, 33%, 70%)

CMYK

cmyk(0%, 3%, 33%, 30%)

Oklch

oklch(74.2% 0.073 103.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2E5451

522D30

Analogous

2D523D

2E5451

2D4352

Triadic

2E5451

4F2D52

524F2D

Split-Comp.

2E5451

522D43

523D2D

Tetradic

2E5451

3D2D52

522D30

43522D

Contrast Matrix WCAG 2.1 Contrast

2E5451	208760	929624	D58708	B3AE78
—	1.9 Fail	2.6 Fail	2.9 Fail	3.7 AA Large
1.9 Fail	—	1.4 Fail	1.6 Fail	2.0 Fail
2.6 Fail	1.4 Fail	—	1.1 Fail	1.4 Fail
2.9 Fail	1.6 Fail	1.1 Fail	—	1.3 Fail
3.7 AA Large	2.0 Fail	1.4 Fail	1.3 Fail	—

White BG

8.4AAA

4.5AA Large

3.2AA Large

2.9Fail

2.3Fail

Black BG

2.5Fail

4.7AA

6.6AA

7.3AAA

9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3E3F52

4D4E69

949440

B3B327

B1B185

Deuteranopia

3C3952

473F6C

949346

B8BE2E

B1B288

Tritanopia

305252

257173

92555A

D13F44

B38F92

Achromatopsia

484848

646464

888888

909090

A9A9A9

Shades & Tints Shades & Tints

#2E5451

Dark

Light

#208760

Dark

Light

#929624

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2e5451;
  --color-2: #208760;
  --color-3: #929624;
  --color-4: #d58708;
  --color-5: #b3ae78;
}

SCSS

$color-1: #2e5451;
$color-2: #208760;
$color-3: #929624;
$color-4: #d58708;
$color-5: #b3ae78;

TAILWIND

colors: {
  'brand-1': '#2e5451',
  'brand-2': '#208760',
  'brand-3': '#929624',
  'brand-4': '#d58708',
  'brand-5': '#b3ae78',
}

RGB Array

[46, 84, 81], [32, 135, 96], [146, 150, 36], [213, 135, 8], [179, 174, 120]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #2E5451, #208760, #929624, #D58708, #B3AE78 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: #2e5451; --color-2: #208760; --color-3: #929624; --color-4: #d58708; --color-5: #b3ae78. 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