← Back to Editor

#AB2410 · #875A85 · #59869D · #61A5B0 · #FAE9B1

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#AB2410

Vermilion · FireBrick · Wine Red

HEX
#AB2410
RGB
rgb(171, 36, 16)
HSL
hsl(8, 83%, 37%)
HSB
hsb(8, 91%, 67%)
CMYK
cmyk(0%, 79%, 91%, 33%)
Oklch
oklch(48.4% 0.174 31.4)

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

#875A85

Rose Purple · Gray · Violet

HEX
#875A85
RGB
rgb(135, 90, 133)
HSL
hsl(303, 20%, 44%)
HSB
hsb(303, 33%, 53%)
CMYK
cmyk(0%, 33%, 1%, 47%)
Oklch
oklch(53.1% 0.085 328.2)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

#59869D

Slate Blue · CadetBlue · Navy Blue

HEX
#59869D
RGB
rgb(89, 134, 157)
HSL
hsl(200, 28%, 48%)
HSB
hsb(200, 43%, 62%)
CMYK
cmyk(43%, 15%, 0%, 38%)
Oklch
oklch(59.6% 0.060 231.3)

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

#61A5B0

Slate Blue · CadetBlue · Lake Green

HEX
#61A5B0
RGB
rgb(97, 165, 176)
HSL
hsl(188, 33%, 54%)
HSB
hsb(188, 45%, 69%)
CMYK
cmyk(45%, 6%, 0%, 31%)
Oklch
oklch(68.1% 0.071 208.9)

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

#FAE9B1

Goose Yellow · Wheat · Lemon Cream

HEX
#FAE9B1
RGB
rgb(250, 233, 177)
HSL
hsl(46, 88%, 84%)
HSB
hsb(46, 29%, 98%)
CMYK
cmyk(0%, 7%, 29%, 2%)
Oklch
oklch(93.4% 0.074 93.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AB2410
1098AD

Analogous

AD1049
AB2410
AD7310

Triadic

AB2410
10AD25
2510AD

Split-Comp.

AB2410
10AD73
1049AD

Tetradic

AB2410
49AD10
1098AD
7310AD

Contrast Matrix WCAG 2.1 Contrast

AB2410
875A85
59869D
61A5B0
FAE9B1
—
1.3
Fail
1.8
Fail
2.5
Fail
5.8
AA
1.3
Fail
—
1.4
Fail
2.0
Fail
4.5
AA
1.8
Fail
1.4
Fail
—
1.4
Fail
3.3
AA Large
2.5
Fail
2.0
Fail
1.4
Fail
—
2.3
Fail
5.8
AA
4.5
AA
3.3
AA Large
2.3
Fail
—
White BG
7.0AAA
5.5AA
3.9AA Large
2.8Fail
1.2Fail
Black BG
3.0Fail
3.8AA Large
5.3AA
7.5AAA
17.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

716F15
74737B
6C6D97
7E7FAD
F3F2BF

Deuteranopia

788316
767A78
6A6796
7B75AD
F4F5C2

Tritanopia

A4191A
857271
5B9392
64ABAB
F9C9CC

Achromatopsia

4A4A4A
6C6C6C
7B7B7B
929292
E8E8E8

Shades & Tints Shades & Tints

#AB2410

Dark
Light

#875A85

Dark
Light

#59869D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ab2410;
  --color-2: #875a85;
  --color-3: #59869d;
  --color-4: #61a5b0;
  --color-5: #fae9b1;
}

SCSS

$color-1: #ab2410;
$color-2: #875a85;
$color-3: #59869d;
$color-4: #61a5b0;
$color-5: #fae9b1;

TAILWIND

colors: {
  'brand-1': '#ab2410',
  'brand-2': '#875a85',
  'brand-3': '#59869d',
  'brand-4': '#61a5b0',
  'brand-5': '#fae9b1',
}

RGB Array

[171, 36, 16], [135, 90, 133], [89, 134, 157], [97, 165, 176], [250, 233, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AB2410, #875A85, #59869D, #61A5B0, #FAE9B1 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #ab2410; --color-2: #875a85; --color-3: #59869d; --color-4: #61a5b0; --color-5: #fae9b1. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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