#4F7980 + #438E90 + #26BFB4 + #01FFE4 + #723D53 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#4F7980

Slate Blue · SlateGray · Mint Ice

HEX

#4F7980

RGB

rgb(79, 121, 128)

HSL

hsl(189, 24%, 41%)

HSB

hsb(189, 38%, 50%)

CMYK

cmyk(38%, 5%, 0%, 50%)

Oklch

oklch(54.8% 0.048 209.0)

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

#438E90

Slate Blue · CadetBlue · Mint Ice

HEX

#438E90

RGB

rgb(67, 142, 144)

HSL

hsl(182, 36%, 41%)

HSB

hsb(182, 53%, 56%)

CMYK

cmyk(53%, 1%, 0%, 44%)

Oklch

oklch(60.0% 0.074 197.7)

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

#26BFB4

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#26BFB4

RGB

rgb(38, 191, 180)

HSL

hsl(176, 67%, 45%)

HSB

hsb(176, 80%, 75%)

CMYK

cmyk(80%, 0%, 6%, 25%)

Oklch

oklch(72.8% 0.120 187.3)

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

#01FFE4

Mineral Blue · Cyan · Mint Ice

HEX

#01FFE4

RGB

rgb(1, 255, 228)

HSL

hsl(174, 100%, 50%)

HSB

hsb(174, 100%, 100%)

CMYK

cmyk(100%, 0%, 11%, 0%)

Oklch

oklch(89.7% 0.161 181.5)

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

#723D53

Dark Violet · DimGray · Camellia

HEX

#723D53

RGB

rgb(114, 61, 83)

HSL

hsl(335, 30%, 34%)

HSB

hsb(335, 46%, 45%)

CMYK

cmyk(0%, 46%, 27%, 55%)

Oklch

oklch(43.3% 0.079 354.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4F7980

82574F

Analogous

4F8270

4F7980

4F6182

Triadic

4F7980

824F7A

7A824F

Split-Comp.

4F7980

824F61

82704F

Tetradic

4F7980

704F82

82574F

61824F

Contrast Matrix WCAG 2.1 Contrast

4F7980	438E90	26BFB4	01FFE4	723D53
—	1.3 Fail	2.1 Fail	3.8 AA Large	1.7 Fail
1.3 Fail	—	1.7 Fail	3.0 Fail	2.2 Fail
2.1 Fail	1.7 Fail	—	1.8 Fail	3.7 AA Large
3.8 AA Large	3.0 Fail	1.8 Fail	—	6.5 AA
1.7 Fail	2.2 Fail	3.7 AA Large	6.5 AA	—

White BG

4.8AA

3.8AA Large

2.3Fail

1.3Fail

8.4AAA

Black BG

4.4AA Large

5.5AA

9.2AAA

16.4AAA

2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

61627E

636490

686AB7

6F71EB

5B5B4E

Deuteranopia

5F5C7E

5F5A8F

5F54B7

604DEC

5E624C

Tritanopia

517D7D

478F8F

2EB9B9

0EF0F1

6F4949

Achromatopsia

6D6D6D

787878

909090

B0B0B0

4F4F4F

Shades & Tints Shades & Tints

#4F7980

Dark

Light

#438E90

Dark

Light

#26BFB4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4f7980;
  --color-2: #438e90;
  --color-3: #26bfb4;
  --color-4: #01ffe4;
  --color-5: #723d53;
}

SCSS

$color-1: #4f7980;
$color-2: #438e90;
$color-3: #26bfb4;
$color-4: #01ffe4;
$color-5: #723d53;

TAILWIND

colors: {
  'brand-1': '#4f7980',
  'brand-2': '#438e90',
  'brand-3': '#26bfb4',
  'brand-4': '#01ffe4',
  'brand-5': '#723d53',
}

RGB Array

[79, 121, 128], [67, 142, 144], [38, 191, 180], [1, 255, 228], [114, 61, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4F7980, #438E90, #26BFB4, #01FFE4, #723D53 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: #4f7980; --color-2: #438e90; --color-3: #26bfb4; --color-4: #01ffe4; --color-5: #723d53. 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