← Back to Editor

#C62201 · #D70F5A · #AE87A5 · #1C8E98 · #088574

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

#C62201

Vermilion · FireBrick · Wine Red

HEX
#C62201
RGB
rgb(198, 34, 1)
HSL
hsl(10, 99%, 39%)
HSB
hsb(10, 99%, 78%)
CMYK
cmyk(0%, 83%, 99%, 22%)
Oklch
oklch(53.2% 0.201 32.0)

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

#D70F5A

Dark Violet · Crimson · Camellia

HEX
#D70F5A
RGB
rgb(215, 15, 90)
HSL
hsl(338, 87%, 45%)
HSB
hsb(338, 93%, 84%)
CMYK
cmyk(0%, 93%, 58%, 16%)
Oklch
oklch(56.6% 0.221 9.2)

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

#AE87A5

Mauve · DarkGray · Lilac Purple

HEX
#AE87A5
RGB
rgb(174, 135, 165)
HSL
hsl(314, 19%, 61%)
HSB
hsb(314, 22%, 68%)
CMYK
cmyk(0%, 22%, 5%, 32%)
Oklch
oklch(67.0% 0.063 334.6)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#1C8E98

Lake Blue · Teal · Mint Ice

HEX
#1C8E98
RGB
rgb(28, 142, 152)
HSL
hsl(185, 69%, 35%)
HSB
hsb(185, 82%, 60%)
CMYK
cmyk(82%, 7%, 0%, 40%)
Oklch
oklch(59.2% 0.095 204.2)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#088574

Mineral Blue · Teal · Mint Ice

HEX
#088574
RGB
rgb(8, 133, 116)
HSL
hsl(172, 89%, 28%)
HSB
hsb(172, 94%, 52%)
CMYK
cmyk(94%, 0%, 13%, 48%)
Oklch
oklch(55.3% 0.099 179.5)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C62201
01A5C6

Analogous

C60143
C62201
C68401

Triadic

C62201
01C622
2201C6

Split-Comp.

C62201
01C684
0143C6

Tetradic

C62201
43C601
01A5C6
8401C6

Contrast Matrix WCAG 2.1 Contrast

C62201
D70F5A
AE87A5
1C8E98
088574
—
1.1
Fail
1.9
Fail
1.5
Fail
1.3
Fail
1.1
Fail
—
1.7
Fail
1.3
Fail
1.1
Fail
1.9
Fail
1.7
Fail
—
1.3
Fail
1.5
Fail
1.5
Fail
1.3
Fail
1.3
Fail
—
1.2
Fail
1.3
Fail
1.1
Fail
1.5
Fail
1.2
Fail
—
White BG
5.8AA
5.1AA
3.1AA Large
3.9AA Large
4.5AA
Black BG
3.6AA Large
4.1AA Large
6.8AA
5.4AA
4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7F7E09
807F48
9D9D9E
4D4E96
3E3F78

Deuteranopia

89950B
8C9B44
9FA29C
473E95
372E79

Tritanopia

BE0F11
CD3A36
AC9897
229493
0E7B7C

Achromatopsia

4F4F4F
535353
969696
6D6D6D
5E5E5E

Shades & Tints Shades & Tints

#C62201

Dark
Light

#D70F5A

Dark
Light

#AE87A5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c62201;
  --color-2: #d70f5a;
  --color-3: #ae87a5;
  --color-4: #1c8e98;
  --color-5: #088574;
}

SCSS

$color-1: #c62201;
$color-2: #d70f5a;
$color-3: #ae87a5;
$color-4: #1c8e98;
$color-5: #088574;

TAILWIND

colors: {
  'brand-1': '#c62201',
  'brand-2': '#d70f5a',
  'brand-3': '#ae87a5',
  'brand-4': '#1c8e98',
  'brand-5': '#088574',
}

RGB Array

[198, 34, 1], [215, 15, 90], [174, 135, 165], [28, 142, 152], [8, 133, 116]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C62201, #D70F5A, #AE87A5, #1C8E98, #088574 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: #c62201; --color-2: #d70f5a; --color-3: #ae87a5; --color-4: #1c8e98; --color-5: #088574. 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