#90ADB0 + #0D9ABD + #078EB0 + #106D85 + #3F4344 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#90ADB0

Sky Blue · DarkGray · Lake Green

HEX

#90ADB0

RGB

rgb(144, 173, 176)

HSL

hsl(186, 17%, 63%)

HSB

hsb(186, 18%, 69%)

CMYK

cmyk(18%, 2%, 0%, 31%)

Oklch

oklch(72.7% 0.032 204.2)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#0D9ABD

Lake Blue · LightSeaGreen · Mint Ice

HEX

#0D9ABD

RGB

rgb(13, 154, 189)

HSL

hsl(192, 87%, 40%)

HSB

hsb(192, 93%, 74%)

CMYK

cmyk(93%, 19%, 0%, 26%)

Oklch

oklch(63.7% 0.116 221.9)

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

#078EB0

Lake Blue · LightSeaGreen · Mint Ice

HEX

#078EB0

RGB

rgb(7, 142, 176)

HSL

hsl(192, 92%, 36%)

HSB

hsb(192, 96%, 69%)

CMYK

cmyk(96%, 19%, 0%, 31%)

Oklch

oklch(60.0% 0.110 222.8)

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

#106D85

Lake Blue · Teal · Mint Ice

HEX

#106D85

RGB

rgb(16, 109, 133)

HSL

hsl(192, 79%, 29%)

HSB

hsb(192, 88%, 52%)

CMYK

cmyk(88%, 18%, 0%, 48%)

Oklch

oklch(49.7% 0.087 221.1)

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

#3F4344

Dark Cyan · DarkSlateGray · Charcoal

HEX

#3F4344

RGB

rgb(63, 67, 68)

HSL

hsl(192, 4%, 26%)

HSB

hsb(192, 7%, 27%)

CMYK

cmyk(7%, 1%, 0%, 73%)

Oklch

oklch(37.9% 0.006 214.4)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

90ADB0

B19491

Analogous

91B1A4

90ADB0

919DB1

Triadic

90ADB0

B191AD

ADB191

Split-Comp.

90ADB0

B1919D

B1A491

Tetradic

90ADB0

A491B1

B19491

9DB191

Contrast Matrix WCAG 2.1 Contrast

90ADB0	0D9ABD	078EB0	106D85	3F4344
—	1.4 Fail	1.6 Fail	2.5 Fail	4.2 AA Large
1.4 Fail	—	1.2 Fail	1.8 Fail	3.0 AA Large
1.6 Fail	1.2 Fail	—	1.6 Fail	2.6 Fail
2.5 Fail	1.8 Fail	1.6 Fail	—	1.7 Fail
4.2 AA Large	3.0 AA Large	2.6 Fail	1.7 Fail	—

White BG

2.4Fail

3.3AA Large

3.8AA Large

5.9AA

10.0AAA

Black BG

8.8AAA

6.4AA

5.5AA

3.5AA Large

2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9D9DAF

4A4BB5

4143A8

38397F

414144

Deuteranopia

9B99AF

4237B2

3A30A6

332C7E

414044

Tritanopia

91AFAF

14AEAC

0EA1A0

157B7A

3F4444

Achromatopsia

A5A5A5

747474

6A6A6A

545454

424242

Shades & Tints Shades & Tints

#90ADB0

Dark

Light

#0D9ABD

Dark

Light

#078EB0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #90adb0;
  --color-2: #0d9abd;
  --color-3: #078eb0;
  --color-4: #106d85;
  --color-5: #3f4344;
}

SCSS

$color-1: #90adb0;
$color-2: #0d9abd;
$color-3: #078eb0;
$color-4: #106d85;
$color-5: #3f4344;

TAILWIND

colors: {
  'brand-1': '#90adb0',
  'brand-2': '#0d9abd',
  'brand-3': '#078eb0',
  'brand-4': '#106d85',
  'brand-5': '#3f4344',
}

RGB Array

[144, 173, 176], [13, 154, 189], [7, 142, 176], [16, 109, 133], [63, 67, 68]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #90ADB0, #0D9ABD, #078EB0, #106D85, #3F4344 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: #90adb0; --color-2: #0d9abd; --color-3: #078eb0; --color-4: #106d85; --color-5: #3f4344. 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