← Back to Editor

#EBA13B · #D9A65F · #AB906A · #8C857A · #828282

space

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#EBA13B

Ginger · GoldenRod · Warm Sun

HEX
#EBA13B
RGB
rgb(235, 161, 59)
HSL
hsl(35, 81%, 58%)
HSB
hsb(35, 75%, 92%)
CMYK
cmyk(0%, 31%, 75%, 8%)
Oklch
oklch(76.4% 0.143 70.7)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#D9A65F

Ginger · SandyBrown · Warm Sun

HEX
#D9A65F
RGB
rgb(217, 166, 95)
HSL
hsl(35, 62%, 61%)
HSB
hsb(35, 56%, 85%)
CMYK
cmyk(0%, 24%, 56%, 15%)
Oklch
oklch(75.8% 0.107 74.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#AB906A

Ginger · Gray · Warm Sun

HEX
#AB906A
RGB
rgb(171, 144, 106)
HSL
hsl(35, 28%, 54%)
HSB
hsb(35, 38%, 67%)
CMYK
cmyk(0%, 16%, 38%, 33%)
Oklch
oklch(66.9% 0.062 75.8)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#8C857A

Ash · Gray · Warm Gray

HEX
#8C857A
RGB
rgb(140, 133, 122)
HSL
hsl(37, 7%, 51%)
HSB
hsb(37, 13%, 55%)
CMYK
cmyk(0%, 5%, 13%, 45%)
Oklch
oklch(62.0% 0.018 79.3)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#828282

Ash · Gray · Warm Gray

HEX
#828282
RGB
rgb(130, 130, 130)
HSL
hsl(0, 0%, 51%)
HSB
hsb(0, 0%, 51%)
CMYK
cmyk(0%, 0%, 0%, 49%)
Oklch
oklch(60.7% 0.000 89.9)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EBA13B
3D85EB

Analogous

EB4C3D
EBA13B
DCEB3D

Triadic

EBA13B
3DEBA2
A23DEB

Split-Comp.

EBA13B
3DDCEB
4C3DEB

Tetradic

EBA13B
3DEB4C
3D85EB
EB3DDC

Contrast Matrix WCAG 2.1 Contrast

EBA13B
D9A65F
AB906A
8C857A
828282
—
1.0
Fail
1.4
Fail
1.7
Fail
1.8
Fail
1.0
Fail
—
1.4
Fail
1.7
Fail
1.8
Fail
1.4
Fail
1.4
Fail
—
1.2
Fail
1.3
Fail
1.7
Fail
1.7
Fail
1.2
Fail
—
1.1
Fail
1.8
Fail
1.8
Fail
1.3
Fail
1.1
Fail
—
White BG
2.2Fail
2.2Fail
3.0AA Large
3.7AA Large
3.8AA Large
Black BG
9.7AAA
9.6AAA
6.9AA
5.8AA
5.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCA54
C3C270
9F9F73
89897D
828282

Deuteranopia

CFD55A
C6CA74
A1A375
898A7D
828282

Tritanopia

E7676B
D67E81
AA7A7C
8C7F7F
828282

Achromatopsia

ABABAB
ADADAD
949494
868686
828282

Shades & Tints Shades & Tints

#EBA13B

Dark
Light

#D9A65F

Dark
Light

#AB906A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eba13b;
  --color-2: #d9a65f;
  --color-3: #ab906a;
  --color-4: #8c857a;
  --color-5: #828282;
}

SCSS

$color-1: #eba13b;
$color-2: #d9a65f;
$color-3: #ab906a;
$color-4: #8c857a;
$color-5: #828282;

TAILWIND

colors: {
  'brand-1': '#eba13b',
  'brand-2': '#d9a65f',
  'brand-3': '#ab906a',
  'brand-4': '#8c857a',
  'brand-5': '#828282',
}

RGB Array

[235, 161, 59], [217, 166, 95], [171, 144, 106], [140, 133, 122], [130, 130, 130]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #EBA13B, #D9A65F, #AB906A, #8C857A, #828282 is ideal for: corporate websites, product showcases, portfolios. 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: #eba13b; --color-2: #d9a65f; --color-3: #ab906a; --color-4: #8c857a; --color-5: #828282. 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. 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 space-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