← Back to Editor

#DBA525 · #CC937A · #B3937F · #857A7F · #716780

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 Library

Color Details Color Details

#DBA525

Ochre · GoldenRod · Honey Gold

HEX
#DBA525
RGB
rgb(219, 165, 37)
HSL
hsl(42, 72%, 50%)
HSB
hsb(42, 83%, 86%)
CMYK
cmyk(0%, 25%, 83%, 14%)
Oklch
oklch(75.3% 0.145 83.1)

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

#CC937A

Apricot · DarkSalmon · Warm Sun

HEX
#CC937A
RGB
rgb(204, 147, 122)
HSL
hsl(18, 45%, 64%)
HSB
hsb(18, 40%, 80%)
CMYK
cmyk(0%, 28%, 40%, 20%)
Oklch
oklch(71.2% 0.078 44.6)

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

#B3937F

Tangerine · Tan · Warm Sun

HEX
#B3937F
RGB
rgb(179, 147, 127)
HSL
hsl(23, 25%, 60%)
HSB
hsb(23, 29%, 70%)
CMYK
cmyk(0%, 18%, 29%, 30%)
Oklch
oklch(68.7% 0.048 53.7)

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

#857A7F

Ink Gray · Gray · Warm Gray

HEX
#857A7F
RGB
rgb(133, 122, 127)
HSL
hsl(333, 4%, 50%)
HSB
hsb(333, 8%, 52%)
CMYK
cmyk(0%, 8%, 5%, 48%)
Oklch
oklch(59.1% 0.015 348.3)

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

#716780

Deep Indigo · DimGray · Violet

HEX
#716780
RGB
rgb(113, 103, 128)
HSL
hsl(264, 11%, 45%)
HSB
hsb(264, 20%, 50%)
CMYK
cmyk(12%, 20%, 0%, 50%)
Oklch
oklch(53.2% 0.040 303.3)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DBA525
245BDB

Analogous

DB4824
DBA525
B7DB24

Triadic

DBA525
24DBA4
A424DB

Split-Comp.

DBA525
24B7DB
4824DB

Tetradic

DBA525
24DB48
245BDB
DB24B7

Contrast Matrix WCAG 2.1 Contrast

DBA525
CC937A
B3937F
857A7F
716780
—
1.2
Fail
1.3
Fail
1.9
Fail
2.4
Fail
1.2
Fail
—
1.1
Fail
1.6
Fail
2.0
Fail
1.3
Fail
1.1
Fail
—
1.5
Fail
1.9
Fail
1.9
Fail
1.6
Fail
1.5
Fail
—
1.3
Fail
2.4
Fail
2.0
Fail
1.9
Fail
1.3
Fail
—
White BG
2.2Fail
2.6Fail
2.8Fail
4.1AA Large
5.3AA
Black BG
9.4AAA
8.0AAA
7.4AAA
5.1AA
4.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C4C344
B3B380
A5A584
80807E
6D6D7A

Deuteranopia

C7CB4B
B7BB82
A7A985
81827E
6D6E79

Tritanopia

D85C62
C98586
B18889
847D7D
717574

Achromatopsia

A7A7A7
A1A1A1
9A9A9A
7E7E7E
6D6D6D

Shades & Tints Shades & Tints

#DBA525

Dark
Light

#CC937A

Dark
Light

#B3937F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dba525;
  --color-2: #cc937a;
  --color-3: #b3937f;
  --color-4: #857a7f;
  --color-5: #716780;
}

SCSS

$color-1: #dba525;
$color-2: #cc937a;
$color-3: #b3937f;
$color-4: #857a7f;
$color-5: #716780;

TAILWIND

colors: {
  'brand-1': '#dba525',
  'brand-2': '#cc937a',
  'brand-3': '#b3937f',
  'brand-4': '#857a7f',
  'brand-5': '#716780',
}

RGB Array

[219, 165, 37], [204, 147, 122], [179, 147, 127], [133, 122, 127], [113, 103, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DBA525, #CC937A, #B3937F, #857A7F, #716780 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: #dba525; --color-2: #cc937a; --color-3: #b3937f; --color-4: #857a7f; --color-5: #716780. 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 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