← Back to Editor

#5C306B · #C3317A · #D3C8AA · #C8B006 · #49A59A

warm

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

#5C306B

Dark Plum · DarkSlateBlue · Eggplant

HEX
#5C306B
RGB
rgb(92, 48, 107)
HSL
hsl(285, 38%, 30%)
HSB
hsb(285, 55%, 42%)
CMYK
cmyk(14%, 55%, 0%, 58%)
Oklch
oklch(39.2% 0.107 316.9)

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

#C3317A

Dark Violet · MediumVioletRed · Camellia

HEX
#C3317A
RGB
rgb(195, 49, 122)
HSL
hsl(330, 60%, 48%)
HSB
hsb(330, 75%, 76%)
CMYK
cmyk(0%, 75%, 37%, 24%)
Oklch
oklch(55.9% 0.192 354.9)

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

#D3C8AA

Goose Yellow · Silver · Sunflower

HEX
#D3C8AA
RGB
rgb(211, 200, 170)
HSL
hsl(44, 32%, 75%)
HSB
hsb(44, 19%, 83%)
CMYK
cmyk(0%, 5%, 19%, 17%)
Oklch
oklch(83.4% 0.042 90.3)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#C8B006

Autumn Sage · GoldenRod · Honey Gold

HEX
#C8B006
RGB
rgb(200, 176, 6)
HSL
hsl(53, 94%, 40%)
HSB
hsb(53, 97%, 78%)
CMYK
cmyk(0%, 12%, 97%, 22%)
Oklch
oklch(75.5% 0.156 99.3)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#49A59A

Mineral Blue · CadetBlue · Mint Ice

HEX
#49A59A
RGB
rgb(73, 165, 154)
HSL
hsl(173, 39%, 47%)
HSB
hsb(173, 56%, 65%)
CMYK
cmyk(56%, 0%, 7%, 35%)
Oklch
oklch(66.3% 0.089 184.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5C306B
3E6A2F

Analogous

3E2F6A
5C306B
6A2F5B

Triadic

5C306B
6A5B2F
2F6A5B

Split-Comp.

5C306B
5B6A2F
2F6A3E

Tetradic

5C306B
6A3E2F
3E6A2F
2F5B6A

Contrast Matrix WCAG 2.1 Contrast

5C306B
C3317A
D3C8AA
C8B006
49A59A
—
1.9
Fail
6.0
AA
4.6
AA
3.4
AA Large
1.9
Fail
—
3.1
AA Large
2.4
Fail
1.8
Fail
6.0
AA
3.1
AA Large
—
1.3
Fail
1.8
Fail
4.6
AA
2.4
Fail
1.3
Fail
—
1.4
Fail
3.4
AA Large
1.8
Fail
1.8
Fail
1.4
Fail
—
White BG
10.0AAA
5.2AA
1.7Fail
2.2Fail
2.9Fail
Black BG
2.1Fail
4.0AA Large
12.6AAA
9.7AAA
7.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

49495D
848268
CECEB1
BEBD2F
71729D

Deuteranopia

4C4F59
8C9764
CFD0B3
BFC139
6C659D

Tritanopia

5A514F
BC5A57
D2B7B8
C75057
4E9F9F

Achromatopsia

444444
656565
C8C8C8
A4A4A4
888888

Shades & Tints Shades & Tints

#5C306B

Dark
Light

#C3317A

Dark
Light

#D3C8AA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5c306b;
  --color-2: #c3317a;
  --color-3: #d3c8aa;
  --color-4: #c8b006;
  --color-5: #49a59a;
}

SCSS

$color-1: #5c306b;
$color-2: #c3317a;
$color-3: #d3c8aa;
$color-4: #c8b006;
$color-5: #49a59a;

TAILWIND

colors: {
  'brand-1': '#5c306b',
  'brand-2': '#c3317a',
  'brand-3': '#d3c8aa',
  'brand-4': '#c8b006',
  'brand-5': '#49a59a',
}

RGB Array

[92, 48, 107], [195, 49, 122], [211, 200, 170], [200, 176, 6], [73, 165, 154]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #5C306B, #C3317A, #D3C8AA, #C8B006, #49A59A 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: #5c306b; --color-2: #c3317a; --color-3: #d3c8aa; --color-4: #c8b006; --color-5: #49a59a. 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 warm-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