#A72223 + #24B6B5 + #168783 + #0B6856 + #0E1211 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#A72223

Vermilion · Brown · Wine Red

HEX

#A72223

RGB

rgb(167, 34, 35)

HSL

hsl(360, 66%, 39%)

HSB

hsb(360, 80%, 65%)

CMYK

cmyk(0%, 80%, 79%, 35%)

Oklch

oklch(47.6% 0.169 26.2)

Traditional「Vermilion」· Paint「Wine Red」· Creative Deep Ember

#24B6B5

Lake Blue · LightSeaGreen · Mint Ice

HEX

#24B6B5

RGB

rgb(36, 182, 181)

HSL

hsl(180, 67%, 43%)

HSB

hsb(180, 80%, 71%)

CMYK

cmyk(80%, 0%, 1%, 29%)

Oklch

oklch(70.6% 0.114 194.1)

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

#168783

Mineral Blue · Teal · Mint Ice

HEX

#168783

RGB

rgb(22, 135, 131)

HSL

hsl(178, 72%, 31%)

HSB

hsb(178, 84%, 53%)

CMYK

cmyk(84%, 0%, 3%, 47%)

Oklch

oklch(56.5% 0.093 191.0)

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

#0B6856

Mineral Blue · DarkSlateGray · Peacock Green

HEX

#0B6856

RGB

rgb(11, 104, 86)

HSL

hsl(168, 81%, 23%)

HSB

hsb(168, 89%, 41%)

CMYK

cmyk(89%, 0%, 17%, 59%)

Oklch

oklch(46.3% 0.084 174.8)

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

#0E1211

Mineral Blue · Black · Peacock Green

HEX

#0E1211

RGB

rgb(14, 18, 17)

HSL

hsl(165, 13%, 6%)

HSB

hsb(165, 22%, 7%)

CMYK

cmyk(22%, 0%, 6%, 93%)

Oklch

oklch(17.7% 0.007 178.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A72223

22A5A5

Analogous

A52263

A72223

A56322

Triadic

A72223

22A522

2222A5

Split-Comp.

A72223

22A563

2263A5

Tetradic

A72223

63A522

22A5A5

6322A5

Contrast Matrix WCAG 2.1 Contrast

A72223	24B6B5	168783	0B6856	0E1211
—	2.9 Fail	1.7 Fail	1.1 Fail	2.6 Fail
2.9 Fail	—	1.7 Fail	2.7 Fail	7.6 AAA
1.7 Fail	1.7 Fail	—	1.5 Fail	4.3 AA Large
1.1 Fail	2.7 Fail	1.5 Fail	—	2.8 Fail
2.6 Fail	7.6 AAA	4.3 AA Large	2.8 Fail	—

White BG

7.3AAA

2.5Fail

4.4AA Large

6.7AA

18.9AAA

Black BG

2.9Fail

8.4AAA

4.8AA

3.1AA Large

1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6D6C23

6365B5

474884

33345A

101011

Deuteranopia

757F23

5B50B5

403884

2E275B

100F11

Tritanopia

A02323

2BB5B5

1C8585

105E5F

0E1111

Achromatopsia

4A4A4A

8A8A8A

656565

4A4A4A

111111

Shades & Tints Shades & Tints

#A72223

Dark

Light

#24B6B5

Dark

Light

#168783

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a72223;
  --color-2: #24b6b5;
  --color-3: #168783;
  --color-4: #0b6856;
  --color-5: #0e1211;
}

SCSS

$color-1: #a72223;
$color-2: #24b6b5;
$color-3: #168783;
$color-4: #0b6856;
$color-5: #0e1211;

TAILWIND

colors: {
  'brand-1': '#a72223',
  'brand-2': '#24b6b5',
  'brand-3': '#168783',
  'brand-4': '#0b6856',
  'brand-5': '#0e1211',
}

RGB Array

[167, 34, 35], [36, 182, 181], [22, 135, 131], [11, 104, 86], [14, 18, 17]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A72223, #24B6B5, #168783, #0B6856, #0E1211 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: #a72223; --color-2: #24b6b5; --color-3: #168783; --color-4: #0b6856; --color-5: #0e1211. 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