#088895 + #798C93 + #02ADC7 + #9DCD46 + #4E3A77 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#088895

Lake Blue · Teal · Mint Ice

HEX

#088895

RGB

rgb(8, 136, 149)

HSL

hsl(186, 90%, 31%)

HSB

hsb(186, 95%, 58%)

CMYK

cmyk(95%, 9%, 0%, 42%)

Oklch

oklch(57.3% 0.097 206.8)

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

#798C93

Slate Blue · LightSlateGray · Lake Green

HEX

#798C93

RGB

rgb(121, 140, 147)

HSL

hsl(196, 11%, 53%)

HSB

hsb(196, 18%, 58%)

CMYK

cmyk(18%, 5%, 0%, 42%)

Oklch

oklch(62.7% 0.024 222.0)

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

#02ADC7

Lake Blue · DarkTurquoise · Mint Ice

HEX

#02ADC7

RGB

rgb(2, 173, 199)

HSL

hsl(188, 98%, 39%)

HSB

hsb(188, 99%, 78%)

CMYK

cmyk(99%, 13%, 0%, 22%)

Oklch

oklch(68.7% 0.120 213.4)

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

#9DCD46

Grass Green · GreenYellow · Olive Green

HEX

#9DCD46

RGB

rgb(157, 205, 70)

HSL

hsl(81, 57%, 54%)

HSB

hsb(81, 66%, 80%)

CMYK

cmyk(23%, 0%, 66%, 20%)

Oklch

oklch(78.8% 0.170 126.8)

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

#4E3A77

Deep Indigo · DarkSlateBlue · Eggplant

HEX

#4E3A77

RGB

rgb(78, 58, 119)

HSL

hsl(260, 34%, 35%)

HSB

hsb(260, 51%, 47%)

CMYK

cmyk(34%, 51%, 0%, 53%)

Oklch

oklch(40.1% 0.101 296.7)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

088895

961608

Analogous

08965D

088895

084196

Triadic

088895

960888

889608

Split-Comp.

088895

960841

965D08

Tetradic

088895

5D0896

961608

419608

Contrast Matrix WCAG 2.1 Contrast

088895	798C93	02ADC7	9DCD46	4E3A77
—	1.2 Fail	1.6 Fail	2.3 Fail	2.3 Fail
1.2 Fail	—	1.3 Fail	1.9 Fail	2.7 Fail
1.6 Fail	1.3 Fail	—	1.4 Fail	3.6 AA Large
2.3 Fail	1.9 Fail	1.4 Fail	—	5.1 AA
2.3 Fail	2.7 Fail	3.6 AA Large	5.1 AA	—

White BG

4.2AA Large

3.5AA Large

2.7Fail

1.9Fail

9.6AAA

Black BG

5.0AA

6.0AA

7.8AAA

11.3AAA

2.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

3F4192

818191

4C4EC1

B2B267

454568

Deuteranopia

382E91

807F91

4235BF

AFAB6F

474865

Tritanopia

0E8F8F

7A9090

0BBCBB

9F8086

4D5D5A

Achromatopsia

636363

878787

7D7D7D

AFAFAF

474747

Shades & Tints Shades & Tints

#088895

Dark

Light

#798C93

Dark

Light

#02ADC7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #088895;
  --color-2: #798c93;
  --color-3: #02adc7;
  --color-4: #9dcd46;
  --color-5: #4e3a77;
}

SCSS

$color-1: #088895;
$color-2: #798c93;
$color-3: #02adc7;
$color-4: #9dcd46;
$color-5: #4e3a77;

TAILWIND

colors: {
  'brand-1': '#088895',
  'brand-2': '#798c93',
  'brand-3': '#02adc7',
  'brand-4': '#9dcd46',
  'brand-5': '#4e3a77',
}

RGB Array

[8, 136, 149], [121, 140, 147], [2, 173, 199], [157, 205, 70], [78, 58, 119]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #088895, #798C93, #02ADC7, #9DCD46, #4E3A77 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: #088895; --color-2: #798c93; --color-3: #02adc7; --color-4: #9dcd46; --color-5: #4e3a77. 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