#373447 + #224F66 + #2B847E + #2CA390 + #41CBB2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#373447

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#373447

RGB

rgb(55, 52, 71)

HSL

hsl(249, 15%, 24%)

HSB

hsb(249, 27%, 28%)

CMYK

cmyk(23%, 27%, 0%, 72%)

Oklch

oklch(33.6% 0.033 291.7)

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

#224F66

Slate Blue · DarkSlateGray · Prussian Blue

HEX

#224F66

RGB

rgb(34, 79, 102)

HSL

hsl(200, 50%, 27%)

HSB

hsb(200, 67%, 40%)

CMYK

cmyk(67%, 23%, 0%, 60%)

Oklch

oklch(40.7% 0.063 233.5)

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

#2B847E

Mineral Blue · SeaGreen · Mint Ice

HEX

#2B847E

RGB

rgb(43, 132, 126)

HSL

hsl(176, 51%, 34%)

HSB

hsb(176, 67%, 52%)

CMYK

cmyk(67%, 0%, 5%, 48%)

Oklch

oklch(56.0% 0.083 188.7)

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

#2CA390

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#2CA390

RGB

rgb(44, 163, 144)

HSL

hsl(170, 57%, 41%)

HSB

hsb(170, 73%, 64%)

CMYK

cmyk(73%, 0%, 12%, 36%)

Oklch

oklch(64.7% 0.106 179.6)

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

#41CBB2

Mineral Blue · MediumTurquoise · Lake Green

HEX

#41CBB2

RGB

rgb(65, 203, 178)

HSL

hsl(169, 57%, 53%)

HSB

hsb(169, 68%, 80%)

CMYK

cmyk(68%, 0%, 12%, 20%)

Oklch

oklch(76.2% 0.123 178.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

373447

444634

Analogous

343A46

373447

403446

Triadic

373447

463734

344637

Split-Comp.

373447

464034

3A4634

Tetradic

373447

46343A

444634

344640

Contrast Matrix WCAG 2.1 Contrast

373447	224F66	2B847E	2CA390	41CBB2
—	1.4 Fail	2.7 Fail	3.9 AA Large	6.0 AA
1.4 Fail	—	2.0 Fail	2.8 Fail	4.4 AA Large
2.7 Fail	2.0 Fail	—	1.4 Fail	2.2 Fail
3.9 AA Large	2.8 Fail	1.4 Fail	—	1.5 Fail
6.0 AA	4.4 AA Large	2.2 Fail	1.5 Fail	—

White BG

12.0AAA

8.8AAA

4.5AA Large

3.1AA Large

2.0Fail

Black BG

1.7Fail

2.4Fail

4.7AA

6.7AA

10.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

363642

353660

52527F

606195

7D7EB8

Deuteranopia

363641

33305F

4C4680

595096

756ABA

Tritanopia

373F3E

245C5B

2F8181

329899

48BDBE

Achromatopsia

373737

444444

696969

7D7D7D

9F9F9F

Shades & Tints Shades & Tints

#373447

Dark

Light

#224F66

Dark

Light

#2B847E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #373447;
  --color-2: #224f66;
  --color-3: #2b847e;
  --color-4: #2ca390;
  --color-5: #41cbb2;
}

SCSS

$color-1: #373447;
$color-2: #224f66;
$color-3: #2b847e;
$color-4: #2ca390;
$color-5: #41cbb2;

TAILWIND

colors: {
  'brand-1': '#373447',
  'brand-2': '#224f66',
  'brand-3': '#2b847e',
  'brand-4': '#2ca390',
  'brand-5': '#41cbb2',
}

RGB Array

[55, 52, 71], [34, 79, 102], [43, 132, 126], [44, 163, 144], [65, 203, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #373447, #224F66, #2B847E, #2CA390, #41CBB2 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: #373447; --color-2: #224f66; --color-3: #2b847e; --color-4: #2ca390; --color-5: #41cbb2. 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