#9D300E + #923629 + #823F50 + #714978 + #6152A0 · warm - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#9D300E

Vermilion · Brown · Wine Red

HEX

#9D300E

RGB

rgb(157, 48, 14)

HSL

hsl(14, 84%, 34%)

HSB

hsb(14, 91%, 62%)

CMYK

cmyk(0%, 69%, 91%, 38%)

Oklch

oklch(47.0% 0.150 36.2)

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

#923629

Crimson · Brown · Wine Red

HEX

#923629

RGB

rgb(146, 54, 41)

HSL

hsl(7, 56%, 37%)

HSB

hsb(7, 72%, 57%)

CMYK

cmyk(0%, 63%, 72%, 43%)

Oklch

oklch(46.1% 0.127 30.6)

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

#823F50

Crimson · Sienna · Wine Red

HEX

#823F50

RGB

rgb(130, 63, 80)

HSL

hsl(345, 35%, 38%)

HSB

hsb(345, 52%, 51%)

CMYK

cmyk(0%, 52%, 38%, 49%)

Oklch

oklch(45.8% 0.094 5.4)

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

#714978

Dark Plum · DimGray · Eggplant

HEX

#714978

RGB

rgb(113, 73, 120)

HSL

hsl(291, 24%, 38%)

HSB

hsb(291, 39%, 47%)

CMYK

cmyk(6%, 39%, 0%, 53%)

Oklch

oklch(46.9% 0.088 321.4)

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

#6152A0

Deep Indigo · DarkSlateBlue · Navy Blue

HEX

#6152A0

RGB

rgb(97, 82, 160)

HSL

hsl(252, 32%, 47%)

HSB

hsb(252, 49%, 63%)

CMYK

cmyk(39%, 49%, 0%, 37%)

Oklch

oklch(49.1% 0.122 290.0)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9D300E

0E7EA0

Analogous

A00E35

9D300E

A0790E

Triadic

9D300E

0EA030

300EA0

Split-Comp.

9D300E

0EA079

0E35A0

Tetradic

9D300E

35A00E

0E7EA0

790EA0

Contrast Matrix WCAG 2.1 Contrast

9D300E	923629	823F50	714978	6152A0
—	1.0 Fail	1.0 Fail	1.0 Fail	1.1 Fail
1.0 Fail	—	1.0 Fail	1.1 Fail	1.2 Fail
1.0 Fail	1.0 Fail	—	1.1 Fail	1.2 Fail
1.0 Fail	1.1 Fail	1.1 Fail	—	1.1 Fail
1.1 Fail	1.2 Fail	1.2 Fail	1.1 Fail	—

White BG

7.3AAA

7.5AAA

7.6AAA

7.2AAA

6.5AA

Black BG

2.9Fail

2.8Fail

2.9Fail

3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

6E6D16

6A692C

65644C

605F6D

5B5A8D

Deuteranopia

747C18

70762D

696E4B

62656A

5B5C89

Tritanopia

981D1E

8D2F2F

7F4948

6F6462

607E7B

Achromatopsia

4D4D4D

505050

555555

5A5A5A

5F5F5F

Shades & Tints Shades & Tints

#9D300E

Dark

Light

#923629

Dark

Light

#823F50

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9d300e;
  --color-2: #923629;
  --color-3: #823f50;
  --color-4: #714978;
  --color-5: #6152a0;
}

SCSS

$color-1: #9d300e;
$color-2: #923629;
$color-3: #823f50;
$color-4: #714978;
$color-5: #6152a0;

TAILWIND

colors: {
  'brand-1': '#9d300e',
  'brand-2': '#923629',
  'brand-3': '#823f50',
  'brand-4': '#714978',
  'brand-5': '#6152a0',
}

RGB Array

[157, 48, 14], [146, 54, 41], [130, 63, 80], [113, 73, 120], [97, 82, 160]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #9D300E, #923629, #823F50, #714978, #6152A0 is ideal for: tech websites, dark mode UIs, game UIs. 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: #9d300e; --color-2: #923629; --color-3: #823f50; --color-4: #714978; --color-5: #6152a0. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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