#88967D + #518370 + #1A6F63 + #1D4D48 + #1F2A2E · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#88967D

Celadon · Gray · Olive Green

HEX

#88967D

RGB

rgb(136, 150, 125)

HSL

hsl(94, 11%, 54%)

HSB

hsb(94, 17%, 59%)

CMYK

cmyk(9%, 0%, 17%, 41%)

Oklch

oklch(65.5% 0.040 131.4)

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

#518370

Mineral Blue · DimGray · Olive Green

HEX

#518370

RGB

rgb(81, 131, 112)

HSL

hsl(157, 24%, 42%)

HSB

hsb(157, 38%, 51%)

CMYK

cmyk(38%, 0%, 15%, 49%)

Oklch

oklch(56.9% 0.062 168.1)

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

#1A6F63

Mineral Blue · SeaGreen · Mint Ice

HEX

#1A6F63

RGB

rgb(26, 111, 99)

HSL

hsl(172, 62%, 27%)

HSB

hsb(172, 77%, 44%)

CMYK

cmyk(77%, 0%, 11%, 56%)

Oklch

oklch(49.0% 0.080 181.1)

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

#1D4D48

Mineral Blue · DarkSlateGray · Peacock Green

HEX

#1D4D48

RGB

rgb(29, 77, 72)

HSL

hsl(174, 45%, 21%)

HSB

hsb(174, 62%, 30%)

CMYK

cmyk(62%, 0%, 6%, 70%)

Oklch

oklch(38.6% 0.052 186.0)

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

#1F2A2E

Slate Blue · DarkSlateGray · Peacock Green

HEX

#1F2A2E

RGB

rgb(31, 42, 46)

HSL

hsl(196, 19%, 15%)

HSB

hsb(196, 33%, 18%)

CMYK

cmyk(33%, 9%, 0%, 82%)

Oklch

oklch(27.6% 0.017 222.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

88967D

8B7D97

Analogous

95977D

88967D

7D977F

Triadic

88967D

7D8897

977D88

Split-Comp.

88967D

7F7D97

977D95

Tetradic

88967D

7D9597

8B7D97

977F7D

Contrast Matrix WCAG 2.1 Contrast

88967D	518370	1A6F63	1D4D48	1F2A2E
—	1.4 Fail	1.9 Fail	3.0 AA Large	4.7 AA
1.4 Fail	—	1.4 Fail	2.2 Fail	3.4 AA Large
1.9 Fail	1.4 Fail	—	1.6 Fail	2.4 Fail
3.0 AA Large	2.2 Fail	1.6 Fail	—	1.5 Fail
4.7 AA	3.4 AA Large	2.4 Fail	1.5 Fail	—

White BG

3.1AA Large

4.3AA Large

6.0AA

9.5AAA

14.7AAA

Black BG

6.7AA

4.8AA

3.5AA Large

2.2Fail

1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8E8E83

676775

3F4066

323249

24242D

Deuteranopia

8D8C85

646076

3A3467

2F2B4A

23222D

Tritanopia

898889

547879

1E6869

1F4A4A

202C2C

Achromatopsia

8F8F8F

727272

545454

3E3E3E

272727

Shades & Tints Shades & Tints

#88967D

Dark

Light

#518370

Dark

Light

#1A6F63

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #88967d;
  --color-2: #518370;
  --color-3: #1a6f63;
  --color-4: #1d4d48;
  --color-5: #1f2a2e;
}

SCSS

$color-1: #88967d;
$color-2: #518370;
$color-3: #1a6f63;
$color-4: #1d4d48;
$color-5: #1f2a2e;

TAILWIND

colors: {
  'brand-1': '#88967d',
  'brand-2': '#518370',
  'brand-3': '#1a6f63',
  'brand-4': '#1d4d48',
  'brand-5': '#1f2a2e',
}

RGB Array

[136, 150, 125], [81, 131, 112], [26, 111, 99], [29, 77, 72], [31, 42, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #88967D, #518370, #1A6F63, #1D4D48, #1F2A2E 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: #88967d; --color-2: #518370; --color-3: #1a6f63; --color-4: #1d4d48; --color-5: #1f2a2e. 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