#17BEBC + #37AEA8 + #579D93 + #778D7E + #967C69 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#17BEBC

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#17BEBC

RGB

rgb(23, 190, 188)

HSL

hsl(179, 78%, 42%)

HSB

hsb(179, 88%, 75%)

CMYK

cmyk(88%, 0%, 1%, 25%)

Oklch

oklch(72.6% 0.121 193.4)

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

#37AEA8

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#37AEA8

RGB

rgb(55, 174, 168)

HSL

hsl(177, 52%, 45%)

HSB

hsb(177, 68%, 68%)

CMYK

cmyk(68%, 0%, 3%, 32%)

Oklch

oklch(68.5% 0.103 190.1)

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

#579D93

Mineral Blue · CadetBlue · Mint Ice

HEX

#579D93

RGB

rgb(87, 157, 147)

HSL

hsl(171, 29%, 48%)

HSB

hsb(171, 45%, 62%)

CMYK

cmyk(45%, 0%, 6%, 38%)

Oklch

oklch(64.7% 0.073 183.8)

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

#778D7E

Celadon · Gray · Warm Gray

HEX

#778D7E

RGB

rgb(119, 141, 126)

HSL

hsl(139, 9%, 51%)

HSB

hsb(139, 16%, 55%)

CMYK

cmyk(16%, 0%, 11%, 45%)

Oklch

oklch(62.2% 0.034 155.5)

Traditional「Celadon」· Paint「Warm Gray」· Creative Urban Concrete

#967C69

Tangerine · Gray · Amber Brown

HEX

#967C69

RGB

rgb(150, 124, 105)

HSL

hsl(25, 18%, 50%)

HSB

hsb(25, 30%, 59%)

CMYK

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

Oklch

oklch(60.6% 0.043 58.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

17BEBC

BF181A

Analogous

18BF68

17BEBC

186EBF

Triadic

17BEBC

BC18BF

BFBC18

Split-Comp.

17BEBC

BF186E

BF6818

Tetradic

17BEBC

6818BF

BF181A

6EBF18

Contrast Matrix WCAG 2.1 Contrast

17BEBC	37AEA8	579D93	778D7E	967C69
—	1.2 Fail	1.4 Fail	1.5 Fail	1.7 Fail
1.2 Fail	—	1.2 Fail	1.3 Fail	1.4 Fail
1.4 Fail	1.2 Fail	—	1.1 Fail	1.2 Fail
1.5 Fail	1.3 Fail	1.1 Fail	—	1.1 Fail
1.7 Fail	1.4 Fail	1.2 Fail	1.1 Fail	—

White BG

2.3Fail

2.7Fail

3.2AA Large

3.6AA Large

3.9AA Large

Black BG

9.1AAA

7.8AAA

6.6AA

5.9AA

5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5F61BC

6B6CA9

757695

818182

8B8B6E

Deuteranopia

5649BD

645BAA

716C96

7F7E83

8C8E6F

Tritanopia

1FBDBD

3DABAB

5A9798

788485

957172

Achromatopsia

8C8C8C

8A8A8A

878787

858585

828282

Shades & Tints Shades & Tints

#17BEBC

Dark

Light

#37AEA8

Dark

Light

#579D93

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #17bebc;
  --color-2: #37aea8;
  --color-3: #579d93;
  --color-4: #778d7e;
  --color-5: #967c69;
}

SCSS

$color-1: #17bebc;
$color-2: #37aea8;
$color-3: #579d93;
$color-4: #778d7e;
$color-5: #967c69;

TAILWIND

colors: {
  'brand-1': '#17bebc',
  'brand-2': '#37aea8',
  'brand-3': '#579d93',
  'brand-4': '#778d7e',
  'brand-5': '#967c69',
}

RGB Array

[23, 190, 188], [55, 174, 168], [87, 157, 147], [119, 141, 126], [150, 124, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #17BEBC, #37AEA8, #579D93, #778D7E, #967C69 is ideal for: corporate websites, product showcases, portfolios. 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: #17bebc; --color-2: #37aea8; --color-3: #579d93; --color-4: #778d7e; --color-5: #967c69. 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. 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