← Back to Editor

#717356 · #8F8455 · #AE8C1C · #F70722 · #070F12

warm

A 5-color warm 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

#717356

Autumn Sage · DimGray · Honey Gold

HEX
#717356
RGB
rgb(113, 115, 86)
HSL
hsl(64, 14%, 39%)
HSB
hsb(64, 25%, 45%)
CMYK
cmyk(2%, 0%, 25%, 55%)
Oklch
oklch(54.6% 0.043 111.0)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#8F8455

Ochre · Gray · Honey Gold

HEX
#8F8455
RGB
rgb(143, 132, 85)
HSL
hsl(49, 25%, 45%)
HSB
hsb(49, 41%, 56%)
CMYK
cmyk(0%, 8%, 41%, 44%)
Oklch
oklch(61.2% 0.066 96.6)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#AE8C1C

Ochre · DarkGoldenRod · Honey Gold

HEX
#AE8C1C
RGB
rgb(174, 140, 28)
HSL
hsl(46, 72%, 40%)
HSB
hsb(46, 84%, 68%)
CMYK
cmyk(0%, 20%, 84%, 32%)
Oklch
oklch(65.4% 0.126 90.2)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#F70722

Vermilion · Red · Passion Red

HEX
#F70722
RGB
rgb(247, 7, 34)
HSL
hsl(353, 94%, 50%)
HSB
hsb(353, 97%, 97%)
CMYK
cmyk(0%, 97%, 86%, 3%)
Oklch
oklch(61.6% 0.249 26.4)

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

#070F12

Slate Blue · Black · Peacock Green

HEX
#070F12
RGB
rgb(7, 15, 18)
HSL
hsl(196, 44%, 5%)
HSB
hsb(196, 61%, 7%)
CMYK
cmyk(61%, 17%, 0%, 93%)
Oklch
oklch(16.2% 0.014 222.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

717356
575671

Analogous

716556
717356
627156

Triadic

717356
567071
715670

Split-Comp.

717356
566271
655671

Tetradic

717356
567165
575671
715662

Contrast Matrix WCAG 2.1 Contrast

717356
8F8455
AE8C1C
F70722
070F12
—
1.3
Fail
1.5
Fail
1.2
Fail
3.9
AA Large
1.3
Fail
—
1.2
Fail
1.1
Fail
5.2
AA
1.5
Fail
1.2
Fail
—
1.3
Fail
6.0
AA
1.2
Fail
1.1
Fail
1.3
Fail
—
4.6
AA
3.9
AA Large
5.2
AA
6.0
AA
4.6
AA
—
White BG
4.9AA
3.8AA Large
3.2AA Large
4.2AA Large
19.3AAA
Black BG
4.3AA Large
5.6AA
6.6AA
5.0AA
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

72725D
8A8A60
9F9F37
8F8D1B
0A0B11

Deuteranopia

72725F
8B8C63
A1A43E
9DAF1A
0A0911

Tritanopia

716364
8E696B
AC4C51
EB1615
071111

Achromatopsia

6F6F6F
828282
898989
525252
0D0D0D

Shades & Tints Shades & Tints

#717356

Dark
Light

#8F8455

Dark
Light

#AE8C1C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #717356;
  --color-2: #8f8455;
  --color-3: #ae8c1c;
  --color-4: #f70722;
  --color-5: #070f12;
}

SCSS

$color-1: #717356;
$color-2: #8f8455;
$color-3: #ae8c1c;
$color-4: #f70722;
$color-5: #070f12;

TAILWIND

colors: {
  'brand-1': '#717356',
  'brand-2': '#8f8455',
  'brand-3': '#ae8c1c',
  'brand-4': '#f70722',
  'brand-5': '#070f12',
}

RGB Array

[113, 115, 86], [143, 132, 85], [174, 140, 28], [247, 7, 34], [7, 15, 18]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #717356, #8F8455, #AE8C1C, #F70722, #070F12 is ideal for: tech websites, dark mode UIs, game UIs, 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: #717356; --color-2: #8f8455; --color-3: #ae8c1c; --color-4: #f70722; --color-5: #070f12. 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. 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