#0A5652 + #142D32 + #8C4726 + #401711 + #6A1D31 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#0A5652

Mineral Blue · DarkSlateGray · Peacock Green

HEX

#0A5652

RGB

rgb(10, 86, 82)

HSL

hsl(177, 79%, 19%)

HSB

hsb(177, 88%, 34%)

CMYK

cmyk(88%, 0%, 5%, 66%)

Oklch

oklch(41.0% 0.068 189.2)

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

#142D32

Slate Blue · DarkSlateGray · Peacock Green

HEX

#142D32

RGB

rgb(20, 45, 50)

HSL

hsl(190, 43%, 14%)

HSB

hsb(190, 60%, 20%)

CMYK

cmyk(60%, 10%, 0%, 80%)

Oklch

oklch(27.9% 0.032 212.1)

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

#8C4726

Tangerine · Sienna · Amber Brown

HEX

#8C4726

RGB

rgb(140, 71, 38)

HSL

hsl(19, 57%, 35%)

HSB

hsb(19, 73%, 55%)

CMYK

cmyk(0%, 49%, 73%, 45%)

Oklch

oklch(47.8% 0.104 44.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#401711

Crimson · Black · Deep Berry

HEX

#401711

RGB

rgb(64, 23, 17)

HSL

hsl(8, 58%, 16%)

HSB

hsb(8, 73%, 25%)

CMYK

cmyk(0%, 64%, 73%, 75%)

Oklch

oklch(26.7% 0.066 30.4)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#6A1D31

Dark Violet · Brown · Camellia

HEX

#6A1D31

RGB

rgb(106, 29, 49)

HSL

hsl(344, 57%, 26%)

HSB

hsb(344, 73%, 42%)

CMYK

cmyk(0%, 73%, 54%, 58%)

Oklch

oklch(36.1% 0.110 9.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0A5652

570A0E

Analogous

0A572D

0A5652

0A3457

Triadic

0A5652

530A57

57530A

Split-Comp.

0A5652

570A34

572D0A

Tetradic

0A5652

2D0A57

570A0E

34570A

Contrast Matrix WCAG 2.1 Contrast

0A5652	142D32	8C4726	401711	6A1D31
—	1.7 Fail	1.2 Fail	1.8 Fail	1.3 Fail
1.7 Fail	—	2.1 Fail	1.1 Fail	1.3 Fail
1.2 Fail	2.1 Fail	—	2.3 Fail	1.7 Fail
1.8 Fail	1.1 Fail	2.3 Fail	—	1.4 Fail
1.3 Fail	1.3 Fail	1.7 Fail	1.4 Fail	—

White BG

8.5AAA

14.5AAA

6.9AA

15.6AAA

11.5AAA

Black BG

2.5Fail

1.5Fail

3.0AA Large

1.3Fail

1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2C53

1F1F31

6E6E2E

2E2E12

49482C

Deuteranopia

272153

1D1C31

727730

313413

4D532B

Tritanopia

0E5454

153030

893436

3E1414

662828

Achromatopsia

3F3F3F

262626

585858

232323

363636

Shades & Tints Shades & Tints

#0A5652

Dark

Light

#142D32

Dark

Light

#8C4726

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0a5652;
  --color-2: #142d32;
  --color-3: #8c4726;
  --color-4: #401711;
  --color-5: #6a1d31;
}

SCSS

$color-1: #0a5652;
$color-2: #142d32;
$color-3: #8c4726;
$color-4: #401711;
$color-5: #6a1d31;

TAILWIND

colors: {
  'brand-1': '#0a5652',
  'brand-2': '#142d32',
  'brand-3': '#8c4726',
  'brand-4': '#401711',
  'brand-5': '#6a1d31',
}

RGB Array

[10, 86, 82], [20, 45, 50], [140, 71, 38], [64, 23, 17], [106, 29, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0A5652, #142D32, #8C4726, #401711, #6A1D31 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: #0a5652; --color-2: #142d32; --color-3: #8c4726; --color-4: #401711; --color-5: #6a1d31. 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