← Back to Editor

#71778F · #B06600 · #D8D2B0 · #545569 · #E7910A

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

#71778F

Indigo · SlateGray · Navy Blue

HEX
#71778F
RGB
rgb(113, 119, 143)
HSL
hsl(228, 12%, 50%)
HSB
hsb(228, 21%, 56%)
CMYK
cmyk(21%, 17%, 0%, 44%)
Oklch
oklch(57.3% 0.038 274.1)

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

#B06600

Ochre · DarkGoldenRod · Amber Brown

HEX
#B06600
RGB
rgb(176, 102, 0)
HSL
hsl(35, 100%, 35%)
HSB
hsb(35, 100%, 69%)
CMYK
cmyk(0%, 42%, 100%, 31%)
Oklch
oklch(58.1% 0.132 63.2)

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

#D8D2B0

Fresh Green · Wheat · Lemon Cream

HEX
#D8D2B0
RGB
rgb(216, 210, 176)
HSL
hsl(51, 34%, 77%)
HSB
hsb(51, 19%, 85%)
CMYK
cmyk(0%, 3%, 19%, 15%)
Oklch
oklch(86.0% 0.046 99.0)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#545569

Indigo · DimGray · Prussian Blue

HEX
#545569
RGB
rgb(84, 85, 105)
HSL
hsl(237, 11%, 37%)
HSB
hsb(237, 20%, 41%)
CMYK
cmyk(20%, 19%, 0%, 59%)
Oklch
oklch(45.6% 0.032 282.8)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#E7910A

Ochre · GoldenRod · Amber Brown

HEX
#E7910A
RGB
rgb(231, 145, 10)
HSL
hsl(37, 92%, 47%)
HSB
hsb(37, 96%, 91%)
CMYK
cmyk(0%, 37%, 96%, 9%)
Oklch
oklch(72.9% 0.158 67.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

71778F
8F8970

Analogous

70868F
71778F
79708F

Triadic

71778F
8F7076
768F70

Split-Comp.

71778F
8F7970
868F70

Tetradic

71778F
8F7086
8F8970
708F79

Contrast Matrix WCAG 2.1 Contrast

71778F
B06600
D8D2B0
545569
E7910A
—
1.0
Fail
2.9
Fail
1.6
Fail
1.8
Fail
1.0
Fail
—
2.9
Fail
1.6
Fail
1.8
Fail
2.9
Fail
2.9
Fail
—
4.8
AA
1.6
Fail
1.6
Fail
1.6
Fail
4.8
AA
—
2.9
Fail
1.8
Fail
1.8
Fail
1.6
Fail
2.9
Fail
—
White BG
4.4AA Large
4.4AA Large
1.5Fail
7.3AAA
2.5Fail
Black BG
4.7AA
4.7AA
13.8AAA
2.9Fail
8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

747489
908F19
D5D5B8
545464
C2C12B

Deuteranopia

737388
949A1F
D6D6BA
545463
C7CD33

Tritanopia

718584
AC2C30
D8BFC0
546060
E3444A

Achromatopsia

787878
707070
D0D0D0
575757
9B9B9B

Shades & Tints Shades & Tints

#71778F

Dark
Light

#B06600

Dark
Light

#D8D2B0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #71778f;
  --color-2: #b06600;
  --color-3: #d8d2b0;
  --color-4: #545569;
  --color-5: #e7910a;
}

SCSS

$color-1: #71778f;
$color-2: #b06600;
$color-3: #d8d2b0;
$color-4: #545569;
$color-5: #e7910a;

TAILWIND

colors: {
  'brand-1': '#71778f',
  'brand-2': '#b06600',
  'brand-3': '#d8d2b0',
  'brand-4': '#545569',
  'brand-5': '#e7910a',
}

RGB Array

[113, 119, 143], [176, 102, 0], [216, 210, 176], [84, 85, 105], [231, 145, 10]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #71778F, #B06600, #D8D2B0, #545569, #E7910A 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: #71778f; --color-2: #b06600; --color-3: #d8d2b0; --color-4: #545569; --color-5: #e7910a. 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