← Back to Editor

#48A8C0 · #781818 · #C01818 · #C03048 · #D86078

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 App

Color Details Color Details

#48A8C0

Slate Blue · SteelBlue · Lake Green

HEX
#48A8C0
RGB
rgb(72, 168, 192)
HSL
hsl(192, 49%, 52%)
HSB
hsb(192, 63%, 75%)
CMYK
cmyk(63%, 13%, 0%, 25%)
Oklch
oklch(68.4% 0.096 217.0)

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

#781818

Vermilion · Maroon · Wine Red

HEX
#781818
RGB
rgb(120, 24, 24)
HSL
hsl(0, 67%, 28%)
HSB
hsb(0, 80%, 47%)
CMYK
cmyk(0%, 80%, 80%, 53%)
Oklch
oklch(37.7% 0.131 26.2)

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

#C01818

Vermilion · FireBrick · Passion Red

HEX
#C01818
RGB
rgb(192, 24, 24)
HSL
hsl(0, 78%, 42%)
HSB
hsb(0, 88%, 75%)
CMYK
cmyk(0%, 88%, 88%, 25%)
Oklch
oklch(51.6% 0.199 27.9)

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

#C03048

Crimson · Brown · Passion Red

HEX
#C03048
RGB
rgb(192, 48, 72)
HSL
hsl(350, 60%, 47%)
HSB
hsb(350, 75%, 75%)
CMYK
cmyk(0%, 75%, 63%, 25%)
Oklch
oklch(53.9% 0.179 16.6)

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

#D86078

Peach Pink · LightCoral · Coral Red

HEX
#D86078
RGB
rgb(216, 96, 120)
HSL
hsl(348, 61%, 61%)
HSB
hsb(348, 56%, 85%)
CMYK
cmyk(0%, 56%, 44%, 15%)
Oklch
oklch(64.3% 0.152 10.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

48A8C0
C16149

Analogous

49C19D
48A8C0
496DC1

Triadic

48A8C0
C149A9
A9C149

Split-Comp.

48A8C0
C1496D
C19D49

Tetradic

48A8C0
9D49C1
C16149
6DC149

Contrast Matrix WCAG 2.1 Contrast

48A8C0
781818
C01818
C03048
D86078
—
3.9
AA Large
2.3
Fail
2.0
Fail
1.3
Fail
3.9
AA Large
—
1.7
Fail
1.9
Fail
3.0
AA Large
2.3
Fail
1.7
Fail
—
1.1
Fail
1.7
Fail
2.0
Fail
1.9
Fail
1.1
Fail
—
1.6
Fail
1.3
Fail
3.0
AA Large
1.7
Fail
1.6
Fail
—
White BG
2.7Fail
10.8AAA
6.2AA
5.6AA
3.6AA Large
Black BG
7.6AAA
1.9Fail
3.4AA Large
3.8AA Large
5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7272BA
4E4E18
777618
828042
A4A372

Deuteranopia

6C65B9
545B18
818E18
8A9541
ABB471

Tritanopia

4DB6B5
731818
B81818
B93E3D
D26E6D

Achromatopsia

8E8E8E
353535
4A4A4A
5E5E5E
878787

Shades & Tints Shades & Tints

#48A8C0

Dark
Light

#781818

Dark
Light

#C01818

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #48a8c0;
  --color-2: #781818;
  --color-3: #c01818;
  --color-4: #c03048;
  --color-5: #d86078;
}

SCSS

$color-1: #48a8c0;
$color-2: #781818;
$color-3: #c01818;
$color-4: #c03048;
$color-5: #d86078;

TAILWIND

colors: {
  'brand-1': '#48a8c0',
  'brand-2': '#781818',
  'brand-3': '#c01818',
  'brand-4': '#c03048',
  'brand-5': '#d86078',
}

RGB Array

[72, 168, 192], [120, 24, 24], [192, 24, 24], [192, 48, 72], [216, 96, 120]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #48A8C0, #781818, #C01818, #C03048, #D86078 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #48a8c0; --color-2: #781818; --color-3: #c01818; --color-4: #c03048; --color-5: #d86078. 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. 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