← Back to Editor

#5092B4 · #7D8F98 · #B89A89 · #FFA16D · #020003

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

#5092B4

Slate Blue · SteelBlue · Navy Blue

HEX
#5092B4
RGB
rgb(80, 146, 180)
HSL
hsl(200, 40%, 51%)
HSB
hsb(200, 56%, 71%)
CMYK
cmyk(56%, 19%, 0%, 29%)
Oklch
oklch(63.0% 0.085 232.7)

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

#7D8F98

Slate Blue · LightSlateGray · Navy Blue

HEX
#7D8F98
RGB
rgb(125, 143, 152)
HSL
hsl(200, 12%, 54%)
HSB
hsb(200, 18%, 60%)
CMYK
cmyk(18%, 6%, 0%, 40%)
Oklch
oklch(63.9% 0.025 229.3)

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

#B89A89

Apricot · Tan · Warm Sun

HEX
#B89A89
RGB
rgb(184, 154, 137)
HSL
hsl(22, 25%, 63%)
HSB
hsb(22, 26%, 72%)
CMYK
cmyk(0%, 16%, 26%, 28%)
Oklch
oklch(70.9% 0.043 51.2)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#FFA16D

Apricot · LightSalmon · Warm Sun

HEX
#FFA16D
RGB
rgb(255, 161, 109)
HSL
hsl(21, 100%, 71%)
HSB
hsb(21, 57%, 100%)
CMYK
cmyk(0%, 37%, 57%, 0%)
Oklch
oklch(79.3% 0.131 49.0)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#020003

Royal Purple · Black · Dark Purple

HEX
#020003
RGB
rgb(2, 0, 3)
HSL
hsl(280, 100%, 1%)
HSB
hsb(280, 100%, 1%)
CMYK
cmyk(33%, 100%, 0%, 99%)
Oklch
oklch(6.2% 0.030 318.7)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5092B4
B47150

Analogous

50B4A3
5092B4
5061B4

Triadic

5092B4
B45093
93B450

Split-Comp.

5092B4
B45061
B4A350

Tetradic

5092B4
A350B4
B47150
61B450

Contrast Matrix WCAG 2.1 Contrast

5092B4
7D8F98
B89A89
FFA16D
020003
—
1.0
Fail
1.3
Fail
1.7
Fail
6.1
AA
1.0
Fail
—
1.3
Fail
1.7
Fail
6.2
AA
1.3
Fail
1.3
Fail
—
1.3
Fail
8.0
AAA
1.7
Fail
1.7
Fail
1.3
Fail
—
10.5
AAA
6.1
AA
6.2
AA
8.0
AAA
10.5
AAA
—
White BG
3.4AA Large
3.4AA Large
2.6Fail
2.0Fail
20.9AAA
Black BG
6.1AA
6.3AA
8.0AAA
10.6AAA
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6D6DAC
858596
ABAB8D
D6D57A
010102

Deuteranopia

6964AA
848295
ADAF8E
DCE37D
010102

Tritanopia

53A5A4
7E9494
B69091
FA8486
020202

Achromatopsia

828282
8B8B8B
A1A1A1
B7B7B7
010101

Shades & Tints Shades & Tints

#5092B4

Dark
Light

#7D8F98

Dark
Light

#B89A89

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5092b4;
  --color-2: #7d8f98;
  --color-3: #b89a89;
  --color-4: #ffa16d;
  --color-5: #020003;
}

SCSS

$color-1: #5092b4;
$color-2: #7d8f98;
$color-3: #b89a89;
$color-4: #ffa16d;
$color-5: #020003;

TAILWIND

colors: {
  'brand-1': '#5092b4',
  'brand-2': '#7d8f98',
  'brand-3': '#b89a89',
  'brand-4': '#ffa16d',
  'brand-5': '#020003',
}

RGB Array

[80, 146, 180], [125, 143, 152], [184, 154, 137], [255, 161, 109], [2, 0, 3]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5092B4, #7D8F98, #B89A89, #FFA16D, #020003 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: #5092b4; --color-2: #7d8f98; --color-3: #b89a89; --color-4: #ffa16d; --color-5: #020003. 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 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