← Back to Editor

#8097B0 · #98729E · #994653 · #7E1035 · #370810

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 LibraryData Visualization

Color Details Color Details

#8097B0

Azure · LightSlateGray · Navy Blue

HEX
#8097B0
RGB
rgb(128, 151, 176)
HSL
hsl(211, 23%, 60%)
HSB
hsb(211, 27%, 69%)
CMYK
cmyk(27%, 14%, 0%, 31%)
Oklch
oklch(66.7% 0.046 250.7)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#98729E

Dark Plum · LightSlateGray · Violet

HEX
#98729E
RGB
rgb(152, 114, 158)
HSL
hsl(292, 18%, 53%)
HSB
hsb(292, 28%, 62%)
CMYK
cmyk(4%, 28%, 0%, 38%)
Oklch
oklch(60.5% 0.079 321.8)

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

#994653

Crimson · Sienna · Passion Red

HEX
#994653
RGB
rgb(153, 70, 83)
HSL
hsl(351, 37%, 44%)
HSB
hsb(351, 54%, 60%)
CMYK
cmyk(0%, 54%, 46%, 40%)
Oklch
oklch(50.4% 0.112 12.2)

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

#7E1035

Dark Violet · Brown · Camellia

HEX
#7E1035
RGB
rgb(126, 16, 53)
HSL
hsl(340, 77%, 28%)
HSB
hsb(340, 87%, 49%)
CMYK
cmyk(0%, 87%, 58%, 51%)
Oklch
oklch(38.8% 0.143 8.5)

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

#370810

Vermilion · Black · Deep Berry

HEX
#370810
RGB
rgb(55, 8, 16)
HSL
hsl(350, 75%, 12%)
HSB
hsb(350, 85%, 22%)
CMYK
cmyk(0%, 85%, 71%, 78%)
Oklch
oklch(22.6% 0.074 15.8)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8097B0
B09A82

Analogous

82B0B0
8097B0
8282B0

Triadic

8097B0
B08298
98B082

Split-Comp.

8097B0
B08282
B0B082

Tetradic

8097B0
B082B0
B09A82
82B082

Contrast Matrix WCAG 2.1 Contrast

8097B0
98729E
994653
7E1035
370810
—
1.3
Fail
2.1
Fail
3.5
AA Large
5.8
AA
1.3
Fail
—
1.6
Fail
2.6
Fail
4.3
AA Large
2.1
Fail
1.6
Fail
—
1.7
Fail
2.8
Fail
3.5
AA Large
2.6
Fail
1.7
Fail
—
1.7
Fail
5.8
AA
4.3
AA Large
2.8
Fail
1.7
Fail
—
White BG
3.0AA Large
4.0AA Large
6.3AA
10.4AAA
17.4AAA
Black BG
7.0AA
5.2AA
3.4AA Large
2.0Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8A8AAA
888793
757450
4E4D2C
23220E

Deuteranopia

8987A9
8A8D91
7A804F
555D2A
25290E

Tritanopia

81A5A4
968B89
954D4D
782523
350D0C

Achromatopsia

939393
828282
606060
353535
171717

Shades & Tints Shades & Tints

#8097B0

Dark
Light

#98729E

Dark
Light

#994653

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8097b0;
  --color-2: #98729e;
  --color-3: #994653;
  --color-4: #7e1035;
  --color-5: #370810;
}

SCSS

$color-1: #8097b0;
$color-2: #98729e;
$color-3: #994653;
$color-4: #7e1035;
$color-5: #370810;

TAILWIND

colors: {
  'brand-1': '#8097b0',
  'brand-2': '#98729e',
  'brand-3': '#994653',
  'brand-4': '#7e1035',
  'brand-5': '#370810',
}

RGB Array

[128, 151, 176], [152, 114, 158], [153, 70, 83], [126, 16, 53], [55, 8, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8097B0, #98729E, #994653, #7E1035, #370810 is ideal for: tech websites, dark mode UIs, game UIs, 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: #8097b0; --color-2: #98729e; --color-3: #994653; --color-4: #7e1035; --color-5: #370810. 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. 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 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