#580A31 + #A42129 + #8C7D6A + #559875 + #1B9A93 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#580A31

Dark Violet · Maroon · Raspberry

HEX

#580A31

RGB

rgb(88, 10, 49)

HSL

hsl(330, 80%, 19%)

HSB

hsb(330, 89%, 35%)

CMYK

cmyk(0%, 89%, 44%, 65%)

Oklch

oklch(30.8% 0.114 356.6)

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

#A42129

Vermilion · Brown · Wine Red

HEX

#A42129

RGB

rgb(164, 33, 41)

HSL

hsl(356, 66%, 39%)

HSB

hsb(356, 80%, 64%)

CMYK

cmyk(0%, 80%, 75%, 36%)

Oklch

oklch(47.1% 0.166 23.7)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

#8C7D6A

Ochre · Gray · Amber Brown

HEX

#8C7D6A

RGB

rgb(140, 125, 106)

HSL

hsl(34, 14%, 48%)

HSB

hsb(34, 24%, 55%)

CMYK

cmyk(0%, 11%, 24%, 45%)

Oklch

oklch(59.8% 0.033 73.6)

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

#559875

Celadon · MediumSeaGreen · Olive Green

HEX

#559875

RGB

rgb(85, 152, 117)

HSL

hsl(149, 28%, 46%)

HSB

hsb(149, 44%, 60%)

CMYK

cmyk(44%, 0%, 23%, 40%)

Oklch

oklch(62.5% 0.087 159.6)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#1B9A93

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#1B9A93

RGB

rgb(27, 154, 147)

HSL

hsl(177, 70%, 35%)

HSB

hsb(177, 82%, 60%)

CMYK

cmyk(82%, 0%, 5%, 40%)

Oklch

oklch(62.1% 0.102 189.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

580A31

0A5730

Analogous

570A57

580A31

570A0A

Triadic

580A31

30570A

0A3057

Split-Comp.

580A31

0A570A

0A5757

Tetradic

580A31

57570A

0A5730

0A0A57

Contrast Matrix WCAG 2.1 Contrast

580A31	A42129	8C7D6A	559875	1B9A93
—	1.9 Fail	3.5 AA Large	4.1 AA Large	4.1 AA Large
1.9 Fail	—	1.9 Fail	2.2 Fail	2.2 Fail
3.5 AA Large	1.9 Fail	—	1.2 Fail	1.2 Fail
4.1 AA Large	2.2 Fail	1.2 Fail	—	1.0 Fail
4.1 AA Large	2.2 Fail	1.2 Fail	1.0 Fail	—

White BG

14.0AAA

7.4AAA

4.0AA Large

3.4AA Large

Black BG

1.5Fail

2.8Fail

5.3AA

6.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

363628

6B6A27

86856F

72737D

525395

Deuteranopia

3B4125

737D27

868870

6E6980

4B4195

Tritanopia

54201E

9D2625

8B7273

588486

219696

Achromatopsia

262626

494949

7F7F7F

808080

737373

Shades & Tints Shades & Tints

#580A31

Dark

Light

#A42129

Dark

Light

#8C7D6A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #580a31;
  --color-2: #a42129;
  --color-3: #8c7d6a;
  --color-4: #559875;
  --color-5: #1b9a93;
}

SCSS

$color-1: #580a31;
$color-2: #a42129;
$color-3: #8c7d6a;
$color-4: #559875;
$color-5: #1b9a93;

TAILWIND

colors: {
  'brand-1': '#580a31',
  'brand-2': '#a42129',
  'brand-3': '#8c7d6a',
  'brand-4': '#559875',
  'brand-5': '#1b9a93',
}

RGB Array

[88, 10, 49], [164, 33, 41], [140, 125, 106], [85, 152, 117], [27, 154, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #580A31, #A42129, #8C7D6A, #559875, #1B9A93 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: #580a31; --color-2: #a42129; --color-3: #8c7d6a; --color-4: #559875; --color-5: #1b9a93. 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 pastel-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