← Back to Editor

#885F7E · #5F1515 · #AF2B2E · #DFA254 · #F3BB95

warm

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#885F7E

Rose Purple · Gray · Violet

HEX
#885F7E
RGB
rgb(136, 95, 126)
HSL
hsl(315, 18%, 45%)
HSB
hsb(315, 30%, 53%)
CMYK
cmyk(0%, 30%, 7%, 47%)
Oklch
oklch(53.9% 0.069 335.6)

TraditionalRose Purple」· PaintViolet」· Creative Blush Sunrise

#5F1515

Vermilion · Maroon · Wine Red

HEX
#5F1515
RGB
rgb(95, 21, 21)
HSL
hsl(0, 64%, 23%)
HSB
hsb(0, 78%, 37%)
CMYK
cmyk(0%, 78%, 78%, 63%)
Oklch
oklch(32.4% 0.106 25.4)

TraditionalVermilion」· PaintWine Red」· Creative Blush Sunrise

#AF2B2E

Vermilion · Brown · Passion Red

HEX
#AF2B2E
RGB
rgb(175, 43, 46)
HSL
hsl(359, 61%, 43%)
HSB
hsb(359, 75%, 69%)
CMYK
cmyk(0%, 75%, 74%, 31%)
Oklch
oklch(50.0% 0.168 24.7)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#DFA254

Ginger · SandyBrown · Warm Sun

HEX
#DFA254
RGB
rgb(223, 162, 84)
HSL
hsl(34, 68%, 60%)
HSB
hsb(34, 62%, 87%)
CMYK
cmyk(0%, 27%, 62%, 13%)
Oklch
oklch(75.5% 0.119 71.0)

TraditionalGinger」· PaintWarm Sun」· Creative Blush Sunrise

#F3BB95

Apricot · BurlyWood · Peach Orange

HEX
#F3BB95
RGB
rgb(243, 187, 149)
HSL
hsl(24, 80%, 77%)
HSB
hsb(24, 39%, 95%)
CMYK
cmyk(0%, 23%, 39%, 5%)
Oklch
oklch(83.4% 0.082 55.5)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

885F7E
5E8768

Analogous

7D5E87
885F7E
875E68

Triadic

885F7E
7D875E
5E7D87

Split-Comp.

885F7E
68875E
5E877D

Tetradic

885F7E
877D5E
5E8768
5E6887

Contrast Matrix WCAG 2.1 Contrast

885F7E
5F1515
AF2B2E
DFA254
F3BB95
2.5
Fail
1.2
Fail
2.4
Fail
3.1
AA Large
2.5
Fail
2.0
Fail
5.9
AA
7.7
AAA
1.2
Fail
2.0
Fail
2.9
Fail
3.9
AA Large
2.4
Fail
5.9
AA
2.9
Fail
1.3
Fail
3.1
AA Large
7.7
AAA
3.9
AA Large
1.3
Fail
White BG
5.3AA
13.1AAA
6.5AA
2.2Fail
1.7Fail
Black BG
4.0AA Large
1.6Fail
3.2AA Large
9.4AAA
12.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

767676
3F3E15
76752D
C5C467
DBDA9E

Deuteranopia

797C75
434915
7E872D
C8CD6B
DEE2A0

Tritanopia

86716F
5B1515
A82D2D
DC7679
F0A5A7

Achromatopsia

6F6F6F
2B2B2B
535353
ABABAB
C7C7C7

Shades & Tints Shades & Tints

#885F7E

Dark
Light

#5F1515

Dark
Light

#AF2B2E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #885f7e;
  --color-2: #5f1515;
  --color-3: #af2b2e;
  --color-4: #dfa254;
  --color-5: #f3bb95;
}

SCSS

$color-1: #885f7e;
$color-2: #5f1515;
$color-3: #af2b2e;
$color-4: #dfa254;
$color-5: #f3bb95;

TAILWIND

colors: {
  'brand-1': '#885f7e',
  'brand-2': '#5f1515',
  'brand-3': '#af2b2e',
  'brand-4': '#dfa254',
  'brand-5': '#f3bb95',
}

RGB Array

[136, 95, 126], [95, 21, 21], [175, 43, 46], [223, 162, 84], [243, 187, 149]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #885F7E, #5F1515, #AF2B2E, #DFA254, #F3BB95 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: #885f7e; --color-2: #5f1515; --color-3: #af2b2e; --color-4: #dfa254; --color-5: #f3bb95. 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 warm-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