#1EAB89 + #1F9074 + #162828 + #3F4B49 + #2F3833 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#1EAB89

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#1EAB89

RGB

rgb(30, 171, 137)

HSL

hsl(166, 70%, 39%)

HSB

hsb(166, 82%, 67%)

CMYK

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

Oklch

oklch(66.3% 0.124 171.1)

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

#1F9074

Mineral Blue · SeaGreen · Mint Ice

HEX

#1F9074

RGB

rgb(31, 144, 116)

HSL

hsl(165, 65%, 34%)

HSB

hsb(165, 78%, 56%)

CMYK

cmyk(78%, 0%, 19%, 44%)

Oklch

oklch(58.6% 0.106 171.4)

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

#162828

Slate Blue · DarkSlateGray · Peacock Green

HEX

#162828

RGB

rgb(22, 40, 40)

HSL

hsl(180, 29%, 12%)

HSB

hsb(180, 45%, 16%)

CMYK

cmyk(45%, 0%, 0%, 84%)

Oklch

oklch(26.1% 0.024 195.8)

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

#3F4B49

Mineral Blue · DarkSlateGray · Charcoal

HEX

#3F4B49

RGB

rgb(63, 75, 73)

HSL

hsl(170, 9%, 27%)

HSB

hsb(170, 16%, 29%)

CMYK

cmyk(16%, 0%, 3%, 71%)

Oklch

oklch(40.2% 0.016 184.4)

Traditional「Mineral Blue」· Paint「Charcoal」· Creative Midnight Shadow

#2F3833

Celadon · DarkSlateGray · Dark Stone

HEX

#2F3833

RGB

rgb(47, 56, 51)

HSL

hsl(147, 9%, 20%)

HSB

hsb(147, 16%, 22%)

CMYK

cmyk(16%, 0%, 9%, 78%)

Oklch

oklch(33.1% 0.015 161.2)

Traditional「Celadon」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1EAB89

A91E3E

Analogous

1EA943

1EAB89

1E84A9

Triadic

1EAB89

891EA9

A9891E

Split-Comp.

1EAB89

A91E84

A9431E

Tetradic

1EAB89

431EA9

A91E3E

84A91E

Contrast Matrix WCAG 2.1 Contrast

1EAB89	1F9074	162828	3F4B49	2F3833
—	1.4 Fail	5.3 AA	3.1 AA Large	4.2 AA Large
1.4 Fail	—	3.9 AA Large	2.3 Fail	3.1 AA Large
5.3 AA	3.9 AA Large	—	1.7 Fail	1.3 Fail
3.1 AA Large	2.3 Fail	1.7 Fail	—	1.3 Fail
4.2 AA Large	3.1 AA Large	1.3 Fail	1.3 Fail	—

White BG

2.9Fail

4.0AA Large

15.3AAA

9.1AAA

12.1AAA

Black BG

7.2AAA

5.3AA

1.4Fail

2.3Fail

1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5C91

50517B

1E1E28

444449

333334

Deuteranopia

534893

49417C

1D1B28

44434A

323235

Tritanopia

259899

258081

172828

404A4A

2F3535

Achromatopsia

7D7D7D

6B6B6B

232323

474747

353535

Shades & Tints Shades & Tints

#1EAB89

Dark

Light

#1F9074

Dark

Light

#162828

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1eab89;
  --color-2: #1f9074;
  --color-3: #162828;
  --color-4: #3f4b49;
  --color-5: #2f3833;
}

SCSS

$color-1: #1eab89;
$color-2: #1f9074;
$color-3: #162828;
$color-4: #3f4b49;
$color-5: #2f3833;

TAILWIND

colors: {
  'brand-1': '#1eab89',
  'brand-2': '#1f9074',
  'brand-3': '#162828',
  'brand-4': '#3f4b49',
  'brand-5': '#2f3833',
}

RGB Array

[30, 171, 137], [31, 144, 116], [22, 40, 40], [63, 75, 73], [47, 56, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1EAB89, #1F9074, #162828, #3F4B49, #2F3833 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: #1eab89; --color-2: #1f9074; --color-3: #162828; --color-4: #3f4b49; --color-5: #2f3833. 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 general-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