← Back to Editor

#F01698 · #D61072 · #BC0B4C · #A10627 · #870001

space

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#F01698

Rose Purple · DeepPink · Rose Pink

HEX
#F01698
RGB
rgb(240, 22, 152)
HSL
hsl(324, 88%, 51%)
HSB
hsb(324, 91%, 94%)
CMYK
cmyk(0%, 91%, 37%, 6%)
Oklch
oklch(63.2% 0.254 352.5)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

#D61072

Dark Violet · MediumVioletRed · Camellia

HEX
#D61072
RGB
rgb(214, 16, 114)
HSL
hsl(330, 86%, 45%)
HSB
hsb(330, 93%, 84%)
CMYK
cmyk(0%, 93%, 47%, 16%)
Oklch
oklch(57.1% 0.226 0.1)

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

#BC0B4C

Dark Violet · Crimson · Camellia

HEX
#BC0B4C
RGB
rgb(188, 11, 76)
HSL
hsl(338, 89%, 39%)
HSB
hsb(338, 94%, 74%)
CMYK
cmyk(0%, 94%, 60%, 26%)
Oklch
oklch(51.2% 0.200 9.9)

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

#A10627

Vermilion · FireBrick · Wine Red

HEX
#A10627
RGB
rgb(161, 6, 39)
HSL
hsl(347, 93%, 33%)
HSB
hsb(347, 96%, 63%)
CMYK
cmyk(0%, 96%, 76%, 37%)
Oklch
oklch(45.1% 0.178 20.5)

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

#870001

Vermilion · DarkRed · Wine Red

HEX
#870001
RGB
rgb(135, 0, 1)
HSL
hsl(360, 100%, 26%)
HSB
hsb(360, 100%, 53%)
CMYK
cmyk(0%, 100%, 99%, 47%)
Oklch
oklch(39.2% 0.161 29.0)

Traditional「Vermilion」· Paint「Wine Red」· Creative Deep Ember

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F01698
14F06C

Analogous

DA14F0
F01698
F0142A

Triadic

F01698
98F014
1498F0

Split-Comp.

F01698
2AF014
14F0DA

Tetradic

F01698
F0DA14
14F06C
142AF0

Contrast Matrix WCAG 2.1 Contrast

F01698
D61072
BC0B4C
A10627
870001
—
1.3
Fail
1.6
Fail
2.1
Fail
2.6
Fail
1.3
Fail
—
1.3
Fail
1.6
Fail
2.1
Fail
1.6
Fail
1.3
Fail
—
1.3
Fail
1.6
Fail
2.1
Fail
1.6
Fail
1.3
Fail
—
1.3
Fail
2.6
Fail
2.1
Fail
1.6
Fail
1.3
Fail
—
White BG
4.0AA Large
5.0AA
6.4AA
8.2AAA
10.3AAA
Black BG
5.3AA
4.2AA Large
3.3AA Large
2.6Fail
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

929079
807E5A
6F6E3C
5E5C1F
4D4B01

Deuteranopia

9EAF71
8C9B55
7A8738
67721D
545F01

Tritanopia

E5605A
CC4843
B3302D
991917
800101

Achromatopsia

666666
565656
474747
383838
282828

Shades & Tints Shades & Tints

#F01698

Dark
Light

#D61072

Dark
Light

#BC0B4C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f01698;
  --color-2: #d61072;
  --color-3: #bc0b4c;
  --color-4: #a10627;
  --color-5: #870001;
}

SCSS

$color-1: #f01698;
$color-2: #d61072;
$color-3: #bc0b4c;
$color-4: #a10627;
$color-5: #870001;

TAILWIND

colors: {
  'brand-1': '#f01698',
  'brand-2': '#d61072',
  'brand-3': '#bc0b4c',
  'brand-4': '#a10627',
  'brand-5': '#870001',
}

RGB Array

[240, 22, 152], [214, 16, 114], [188, 11, 76], [161, 6, 39], [135, 0, 1]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #F01698, #D61072, #BC0B4C, #A10627, #870001 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. 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: #f01698; --color-2: #d61072; --color-3: #bc0b4c; --color-4: #a10627; --color-5: #870001. 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. 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 space-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