#04C09E + #1B9C8C + #32787A + #4A5468 + #613056 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#04C09E

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#04C09E

RGB

rgb(4, 192, 158)

HSL

hsl(169, 96%, 38%)

HSB

hsb(169, 98%, 75%)

CMYK

cmyk(98%, 0%, 18%, 25%)

Oklch

oklch(72.1% 0.137 173.8)

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

#1B9C8C

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#1B9C8C

RGB

rgb(27, 156, 140)

HSL

hsl(173, 70%, 36%)

HSB

hsb(173, 83%, 61%)

CMYK

cmyk(83%, 0%, 10%, 39%)

Oklch

oklch(62.4% 0.107 181.8)

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

#32787A

Slate Blue · SeaGreen · Mint Ice

HEX

#32787A

RGB

rgb(50, 120, 122)

HSL

hsl(182, 42%, 34%)

HSB

hsb(182, 59%, 48%)

CMYK

cmyk(59%, 2%, 0%, 52%)

Oklch

oklch(52.9% 0.070 197.8)

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

#4A5468

Indigo · DarkSlateGray · Prussian Blue

HEX

#4A5468

RGB

rgb(74, 84, 104)

HSL

hsl(220, 17%, 35%)

HSB

hsb(220, 29%, 41%)

CMYK

cmyk(29%, 19%, 0%, 59%)

Oklch

oklch(44.5% 0.035 264.1)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#613056

Rose Purple · DarkSlateGray · Eggplant

HEX

#613056

RGB

rgb(97, 48, 86)

HSL

hsl(313, 34%, 28%)

HSB

hsb(313, 51%, 38%)

CMYK

cmyk(0%, 51%, 11%, 62%)

Oklch

oklch(38.8% 0.088 336.2)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

04C09E

BE0426

Analogous

04BE3F

04C09E

0483BE

Triadic

04C09E

9C04BE

BE9C04

Split-Comp.

04C09E

BE0483

BE3F04

Tetradic

04C09E

3F04BE

BE0426

83BE04

Contrast Matrix WCAG 2.1 Contrast

04C09E	1B9C8C	32787A	4A5468	613056
—	1.5 Fail	2.2 Fail	3.3 AA Large	4.4 AA Large
1.5 Fail	—	1.5 Fail	2.2 Fail	3.0 Fail
2.2 Fail	1.5 Fail	—	1.5 Fail	2.0 Fail
3.3 AA Large	2.2 Fail	1.5 Fail	—	1.3 Fail
4.4 AA Large	3.0 Fail	2.0 Fail	1.3 Fail	—

White BG

2.3Fail

3.4AA Large

5.1AA

7.6AAA

10.2AAA

Black BG

9.0AAA

6.2AA

4.1AA Large

2.8Fail

2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5557A6

535490

50517A

4E4E63

4C4B4D

Deuteranopia

4B3CA8

4B4291

4C4779

4E4D62

4F524B

Tritanopia

0DADAE

219394

367979

4B5F5F

5F4644

Achromatopsia

848484

747474

636363

535353

434343

Shades & Tints Shades & Tints

#04C09E

Dark

Light

#1B9C8C

Dark

Light

#32787A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #04c09e;
  --color-2: #1b9c8c;
  --color-3: #32787a;
  --color-4: #4a5468;
  --color-5: #613056;
}

SCSS

$color-1: #04c09e;
$color-2: #1b9c8c;
$color-3: #32787a;
$color-4: #4a5468;
$color-5: #613056;

TAILWIND

colors: {
  'brand-1': '#04c09e',
  'brand-2': '#1b9c8c',
  'brand-3': '#32787a',
  'brand-4': '#4a5468',
  'brand-5': '#613056',
}

RGB Array

[4, 192, 158], [27, 156, 140], [50, 120, 122], [74, 84, 104], [97, 48, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #04C09E, #1B9C8C, #32787A, #4A5468, #613056 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: #04c09e; --color-2: #1b9c8c; --color-3: #32787a; --color-4: #4a5468; --color-5: #613056. 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 cool-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