← Back to Editor

#EB7A04 · #574A30 · #909E47 · #86BEA3 · #FDBEB7

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

#EB7A04

Ochre · Chocolate · Amber Brown

HEX
#EB7A04
RGB
rgb(235, 122, 4)
HSL
hsl(31, 97%, 47%)
HSB
hsb(31, 98%, 92%)
CMYK
cmyk(0%, 48%, 98%, 8%)
Oklch
oklch(69.5% 0.171 54.9)

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

#574A30

Ochre · DarkOliveGreen · Honey Gold

HEX
#574A30
RGB
rgb(87, 74, 48)
HSL
hsl(40, 29%, 26%)
HSB
hsb(40, 45%, 34%)
CMYK
cmyk(0%, 15%, 45%, 66%)
Oklch
oklch(41.5% 0.043 84.1)

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

#909E47

Grass Green · Gray · Olive Green

HEX
#909E47
RGB
rgb(144, 158, 71)
HSL
hsl(70, 38%, 45%)
HSB
hsb(70, 55%, 62%)
CMYK
cmyk(9%, 0%, 55%, 38%)
Oklch
oklch(66.9% 0.113 117.2)

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

#86BEA3

Jade · DarkSeaGreen · Apple Green

HEX
#86BEA3
RGB
rgb(134, 190, 163)
HSL
hsl(151, 30%, 64%)
HSB
hsb(151, 29%, 75%)
CMYK
cmyk(29%, 0%, 14%, 25%)
Oklch
oklch(75.5% 0.070 163.3)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#FDBEB7

Peach Pink · LightPink · Cherry Blossom

HEX
#FDBEB7
RGB
rgb(253, 190, 183)
HSL
hsl(6, 95%, 85%)
HSB
hsb(6, 28%, 99%)
CMYK
cmyk(0%, 25%, 28%, 1%)
Oklch
oklch(85.7% 0.074 25.9)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EB7A04
0474EC

Analogous

EC0704
EB7A04
E8EC04

Triadic

EB7A04
04EC7C
7C04EC

Split-Comp.

EB7A04
04E8EC
0704EC

Tetradic

EB7A04
04EC07
0474EC
EC04E8

Contrast Matrix WCAG 2.1 Contrast

EB7A04
574A30
909E47
86BEA3
FDBEB7
—
3.0
AA Large
1.0
Fail
1.4
Fail
1.8
Fail
3.0
AA Large
—
3.0
Fail
4.1
AA Large
5.4
AA
1.0
Fail
3.0
Fail
—
1.4
Fail
1.8
Fail
1.4
Fail
4.1
AA Large
1.4
Fail
—
1.3
Fail
1.8
Fail
5.4
AA
1.8
Fail
1.3
Fail
—
White BG
2.9Fail
8.7AAA
2.9Fail
2.1Fail
1.6Fail
Black BG
7.3AAA
2.4Fail
7.2AAA
9.9AAA
13.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BAB921
515136
96965C
9E9FAA
E2E1B9

Deuteranopia

C1C927
525338
959461
9B97AB
E5EAB9

Tritanopia

E5373C
563B3C
916D70
89AFB0
FABABA

Achromatopsia

8E8E8E
4B4B4B
909090
AAAAAA
D0D0D0

Shades & Tints Shades & Tints

#EB7A04

Dark
Light

#574A30

Dark
Light

#909E47

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eb7a04;
  --color-2: #574a30;
  --color-3: #909e47;
  --color-4: #86bea3;
  --color-5: #fdbeb7;
}

SCSS

$color-1: #eb7a04;
$color-2: #574a30;
$color-3: #909e47;
$color-4: #86bea3;
$color-5: #fdbeb7;

TAILWIND

colors: {
  'brand-1': '#eb7a04',
  'brand-2': '#574a30',
  'brand-3': '#909e47',
  'brand-4': '#86bea3',
  'brand-5': '#fdbeb7',
}

RGB Array

[235, 122, 4], [87, 74, 48], [144, 158, 71], [134, 190, 163], [253, 190, 183]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EB7A04, #574A30, #909E47, #86BEA3, #FDBEB7 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: #eb7a04; --color-2: #574a30; --color-3: #909e47; --color-4: #86bea3; --color-5: #fdbeb7. 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