← Back to Editor

#E6C33C · #F7374B · #624C47 · #AA58B7 · #B6928F

A 5-color palette 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

#E6C33C

Ginger · GoldenRod · Sunflower

HEX
#E6C33C
RGB
rgb(230, 195, 60)
HSL
hsl(48, 77%, 57%)
HSB
hsb(48, 74%, 90%)
CMYK
cmyk(0%, 15%, 74%, 10%)
Oklch
oklch(82.5% 0.151 93.9)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#F7374B

Vermilion · Tomato · Passion Red

HEX
#F7374B
RGB
rgb(247, 55, 75)
HSL
hsl(354, 92%, 59%)
HSB
hsb(354, 78%, 97%)
CMYK
cmyk(0%, 78%, 70%, 3%)
Oklch
oklch(64.1% 0.225 21.4)

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

#624C47

Crimson · DarkOliveGreen · Wine Red

HEX
#624C47
RGB
rgb(98, 76, 71)
HSL
hsl(11, 16%, 33%)
HSB
hsb(11, 28%, 38%)
CMYK
cmyk(0%, 22%, 28%, 62%)
Oklch
oklch(43.8% 0.031 33.0)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#AA58B7

Dark Plum · MediumOrchid · Violet

HEX
#AA58B7
RGB
rgb(170, 88, 183)
HSL
hsl(292, 40%, 53%)
HSB
hsb(292, 52%, 72%)
CMYK
cmyk(7%, 52%, 0%, 28%)
Oklch
oklch(59.4% 0.163 322.0)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

#B6928F

Peach Pink · DarkGray · Coral Red

HEX
#B6928F
RGB
rgb(182, 146, 143)
HSL
hsl(5, 21%, 64%)
HSB
hsb(5, 21%, 71%)
CMYK
cmyk(0%, 20%, 21%, 29%)
Oklch
oklch(69.2% 0.044 23.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E6C33C
3D5FE6

Analogous

E6703D
E6C33C
B3E63D

Triadic

E6C33C
3DE6C4
C43DE6

Split-Comp.

E6C33C
3DB3E6
703DE6

Tetradic

E6C33C
3DE670
3D5FE6
E63DB3

Contrast Matrix WCAG 2.1 Contrast

E6C33C
F7374B
624C47
AA58B7
B6928F
—
2.2
Fail
4.6
AA
2.6
Fail
1.6
Fail
2.2
Fail
—
2.1
Fail
1.2
Fail
1.3
Fail
4.6
AA
2.1
Fail
—
1.8
Fail
2.8
Fail
2.6
Fail
1.2
Fail
1.8
Fail
—
1.6
Fail
1.6
Fail
1.3
Fail
2.8
Fail
1.6
Fail
—
White BG
1.7Fail
3.7AA Large
7.9AAA
4.4AA Large
2.8Fail
Black BG
12.2AAA
5.6AA
2.6Fail
4.8AA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D75D
A4A246
585848
8686A0
A6A690

Deuteranopia

D9DC65
AFBD45
5A5B49
8B919B
A9AB90

Tritanopia

E4767C
ED4242
614949
A68E8A
B49090

Achromatopsia

BEBEBE
737373
525252
7B7B7B
9C9C9C

Shades & Tints Shades & Tints

#E6C33C

Dark
Light

#F7374B

Dark
Light

#624C47

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e6c33c;
  --color-2: #f7374b;
  --color-3: #624c47;
  --color-4: #aa58b7;
  --color-5: #b6928f;
}

SCSS

$color-1: #e6c33c;
$color-2: #f7374b;
$color-3: #624c47;
$color-4: #aa58b7;
$color-5: #b6928f;

TAILWIND

colors: {
  'brand-1': '#e6c33c',
  'brand-2': '#f7374b',
  'brand-3': '#624c47',
  'brand-4': '#aa58b7',
  'brand-5': '#b6928f',
}

RGB Array

[230, 195, 60], [247, 55, 75], [98, 76, 71], [170, 88, 183], [182, 146, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E6C33C, #F7374B, #624C47, #AA58B7, #B6928F 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: #e6c33c; --color-2: #f7374b; --color-3: #624c47; --color-4: #aa58b7; --color-5: #b6928f. 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