← Back to Editor

#900030 · #1890F0 · #78C0C0 · #186060 · #003048

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#900030

Dark Violet · Brown · Camellia

HEX
#900030
RGB
rgb(144, 0, 48)
HSL
hsl(340, 100%, 28%)
HSB
hsb(340, 100%, 56%)
CMYK
cmyk(0%, 100%, 67%, 44%)
Oklch
oklch(41.6% 0.166 13.6)

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

#1890F0

Lake Blue · DodgerBlue · Navy Blue

HEX
#1890F0
RGB
rgb(24, 144, 240)
HSL
hsl(207, 88%, 52%)
HSB
hsb(207, 90%, 94%)
CMYK
cmyk(90%, 40%, 0%, 6%)
Oklch
oklch(64.2% 0.173 249.8)

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

#78C0C0

Sky Blue · MediumAquaMarine · Lake Green

HEX
#78C0C0
RGB
rgb(120, 192, 192)
HSL
hsl(180, 36%, 61%)
HSB
hsb(180, 38%, 75%)
CMYK
cmyk(38%, 0%, 0%, 25%)
Oklch
oklch(76.1% 0.072 195.7)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#186060

Lake Blue · DarkSlateGray · Peacock Green

HEX
#186060
RGB
rgb(24, 96, 96)
HSL
hsl(180, 60%, 24%)
HSB
hsb(180, 75%, 38%)
CMYK
cmyk(75%, 0%, 0%, 62%)
Oklch
oklch(44.7% 0.068 195.0)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#003048

Lake Blue · MidnightBlue · Deep Sea Blue

HEX
#003048
RGB
rgb(0, 48, 72)
HSL
hsl(200, 100%, 14%)
HSB
hsb(200, 100%, 28%)
CMYK
cmyk(100%, 33%, 0%, 72%)
Oklch
oklch(29.3% 0.064 237.4)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

900030
008F5F

Analogous

8F0077
900030
8F1800

Triadic

900030
308F00
00308F

Split-Comp.

900030
008F18
00778F

Tetradic

900030
778F00
008F5F
18008F

Contrast Matrix WCAG 2.1 Contrast

900030
1890F0
78C0C0
186060
003048
—
2.8
Fail
4.5
AA
1.3
Fail
1.5
Fail
2.8
Fail
—
1.6
Fail
2.2
Fail
4.1
AA Large
4.5
AA
1.6
Fail
—
3.5
AA Large
6.7
AA
1.3
Fail
2.2
Fail
3.5
AA Large
—
1.9
Fail
1.5
Fail
4.1
AA Large
6.7
AA
1.9
Fail
—
White BG
9.4AAA
3.3AA Large
2.1Fail
7.3AAA
13.8AAA
Black BG
2.2Fail
6.3AA
10.1AAA
2.9Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

525024
4C4DD9
9798C0
373860
151542

Deuteranopia

5A6522
453CD3
938EC0
332E60
120E41

Tritanopia

891B19
1EC6C2
7CC0C0
1C6060
023E3D

Achromatopsia

313131
777777
AAAAAA
4A4A4A
242424

Shades & Tints Shades & Tints

#900030

Dark
Light

#1890F0

Dark
Light

#78C0C0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #900030;
  --color-2: #1890f0;
  --color-3: #78c0c0;
  --color-4: #186060;
  --color-5: #003048;
}

SCSS

$color-1: #900030;
$color-2: #1890f0;
$color-3: #78c0c0;
$color-4: #186060;
$color-5: #003048;

TAILWIND

colors: {
  'brand-1': '#900030',
  'brand-2': '#1890f0',
  'brand-3': '#78c0c0',
  'brand-4': '#186060',
  'brand-5': '#003048',
}

RGB Array

[144, 0, 48], [24, 144, 240], [120, 192, 192], [24, 96, 96], [0, 48, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #900030, #1890F0, #78C0C0, #186060, #003048 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #900030; --color-2: #1890f0; --color-3: #78c0c0; --color-4: #186060; --color-5: #003048. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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