← Back to Editor

#D79E33 · #E64163 · #457D7C · #A6A184 · #3B2162

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

#D79E33

Ginger · GoldenRod · Warm Sun

HEX
#D79E33
RGB
rgb(215, 158, 51)
HSL
hsl(39, 67%, 52%)
HSB
hsb(39, 76%, 84%)
CMYK
cmyk(0%, 27%, 76%, 16%)
Oklch
oklch(73.6% 0.136 78.9)

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

#E64163

Vermilion · Tomato · Passion Red

HEX
#E64163
RGB
rgb(230, 65, 99)
HSL
hsl(348, 77%, 58%)
HSB
hsb(348, 72%, 90%)
CMYK
cmyk(0%, 72%, 57%, 10%)
Oklch
oklch(62.5% 0.201 13.5)

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

#457D7C

Mineral Blue · DimGray · Mint Ice

HEX
#457D7C
RGB
rgb(69, 125, 124)
HSL
hsl(179, 29%, 38%)
HSB
hsb(179, 45%, 49%)
CMYK
cmyk(45%, 0%, 1%, 51%)
Oklch
oklch(55.1% 0.059 194.1)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#A6A184

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A6A184
RGB
rgb(166, 161, 132)
HSL
hsl(51, 16%, 58%)
HSB
hsb(51, 20%, 65%)
CMYK
cmyk(0%, 3%, 20%, 35%)
Oklch
oklch(70.5% 0.041 99.2)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#3B2162

Deep Indigo · MidnightBlue · Eggplant

HEX
#3B2162
RGB
rgb(59, 33, 98)
HSL
hsl(264, 50%, 26%)
HSB
hsb(264, 66%, 38%)
CMYK
cmyk(40%, 66%, 0%, 62%)
Oklch
oklch(31.9% 0.110 298.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D79E33
336CD7

Analogous

D74B33
D79E33
BED733

Triadic

D79E33
33D79D
9D33D7

Split-Comp.

D79E33
33BED7
4B33D7

Tetradic

D79E33
33D74B
336CD7
D733BE

Contrast Matrix WCAG 2.1 Contrast

D79E33
E64163
457D7C
A6A184
3B2162
—
1.7
Fail
2.0
Fail
1.1
Fail
5.6
AA
1.7
Fail
—
1.2
Fail
1.5
Fail
3.4
AA Large
2.0
Fail
1.2
Fail
—
1.8
Fail
2.8
Fail
1.1
Fail
1.5
Fail
1.8
Fail
—
5.1
AA
5.6
AA
3.4
AA Large
2.8
Fail
5.1
AA
—
White BG
2.4Fail
4.0AA Large
4.7AA
2.6Fail
13.3AAA
Black BG
8.8AAA
5.3AA
4.5AA Large
8.1AAA
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBE4D
9F9D5B
5D5E7C
A4A48B
303052

Deuteranopia

C2C653
A8B559
5A567C
A4A58D
31334F

Tritanopia

D46166
DE5453
487C7C
A69192
3A4643

Achromatopsia

A3A3A3
767676
6C6C6C
9F9F9F
303030

Shades & Tints Shades & Tints

#D79E33

Dark
Light

#E64163

Dark
Light

#457D7C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d79e33;
  --color-2: #e64163;
  --color-3: #457d7c;
  --color-4: #a6a184;
  --color-5: #3b2162;
}

SCSS

$color-1: #d79e33;
$color-2: #e64163;
$color-3: #457d7c;
$color-4: #a6a184;
$color-5: #3b2162;

TAILWIND

colors: {
  'brand-1': '#d79e33',
  'brand-2': '#e64163',
  'brand-3': '#457d7c',
  'brand-4': '#a6a184',
  'brand-5': '#3b2162',
}

RGB Array

[215, 158, 51], [230, 65, 99], [69, 125, 124], [166, 161, 132], [59, 33, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D79E33, #E64163, #457D7C, #A6A184, #3B2162 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: #d79e33; --color-2: #e64163; --color-3: #457d7c; --color-4: #a6a184; --color-5: #3b2162. 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