← Back to Editor

#FF365A · #C32D52 · #872449 · #4B1A41 · #0F1138

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

#FF365A

Peach Pink · Tomato · Coral Red

HEX
#FF365A
RGB
rgb(255, 54, 90)
HSL
hsl(349, 100%, 61%)
HSB
hsb(349, 79%, 100%)
CMYK
cmyk(0%, 79%, 65%, 0%)
Oklch
oklch(65.6% 0.232 17.4)

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

#C32D52

Vermilion · Crimson · Passion Red

HEX
#C32D52
RGB
rgb(195, 45, 82)
HSL
hsl(345, 62%, 47%)
HSB
hsb(345, 77%, 76%)
CMYK
cmyk(0%, 77%, 58%, 24%)
Oklch
oklch(54.4% 0.185 12.2)

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

#872449

Dark Violet · Brown · Camellia

HEX
#872449
RGB
rgb(135, 36, 73)
HSL
hsl(338, 58%, 34%)
HSB
hsb(338, 73%, 53%)
CMYK
cmyk(0%, 73%, 46%, 47%)
Oklch
oklch(42.8% 0.137 2.2)

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

#4B1A41

Rose Purple · DarkSlateGray · Dark Purple

HEX
#4B1A41
RGB
rgb(75, 26, 65)
HSL
hsl(312, 49%, 20%)
HSB
hsb(312, 65%, 29%)
CMYK
cmyk(0%, 65%, 13%, 71%)
Oklch
oklch(30.9% 0.091 336.3)

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

#0F1138

Indigo · MidnightBlue · Deep Sea Blue

HEX
#0F1138
RGB
rgb(15, 17, 56)
HSL
hsl(237, 58%, 14%)
HSB
hsb(237, 73%, 22%)
CMYK
cmyk(73%, 70%, 0%, 78%)
Oklch
oklch(20.5% 0.074 275.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF365A
38FFDB

Analogous

FF38C0
FF365A
FF7738

Triadic

FF365A
5DFF38
385DFF

Split-Comp.

FF365A
38FF77
38C0FF

Tetradic

FF365A
C0FF38
38FFDB
7738FF

Contrast Matrix WCAG 2.1 Contrast

FF365A
C32D52
872449
4B1A41
0F1138
—
1.6
Fail
2.5
Fail
3.9
AA Large
5.1
AA
1.6
Fail
—
1.6
Fail
2.5
Fail
3.3
AA Large
2.5
Fail
1.6
Fail
—
1.6
Fail
2.1
Fail
3.9
AA Large
2.5
Fail
1.6
Fail
—
1.3
Fail
5.1
AA
3.3
AA Large
2.1
Fail
1.3
Fail
—
White BG
3.5AA Large
5.5AA
8.8AAA
13.8AAA
18.1AAA
Black BG
5.9AA
3.8AA Large
2.4Fail
1.5Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A8A651
828149
5C5B40
363538
10102F

Deuteranopia

B4C34F
8B9647
62693E
393C35
10102C

Tritanopia

F54A49
BC4240
823937
49302E
0F2725

Achromatopsia

767676
5E5E5E
464646
2D2D2D
151515

Shades & Tints Shades & Tints

#FF365A

Dark
Light

#C32D52

Dark
Light

#872449

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff365a;
  --color-2: #c32d52;
  --color-3: #872449;
  --color-4: #4b1a41;
  --color-5: #0f1138;
}

SCSS

$color-1: #ff365a;
$color-2: #c32d52;
$color-3: #872449;
$color-4: #4b1a41;
$color-5: #0f1138;

TAILWIND

colors: {
  'brand-1': '#ff365a',
  'brand-2': '#c32d52',
  'brand-3': '#872449',
  'brand-4': '#4b1a41',
  'brand-5': '#0f1138',
}

RGB Array

[255, 54, 90], [195, 45, 82], [135, 36, 73], [75, 26, 65], [15, 17, 56]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF365A, #C32D52, #872449, #4B1A41, #0F1138 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: #ff365a; --color-2: #c32d52; --color-3: #872449; --color-4: #4b1a41; --color-5: #0f1138. 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