← Back to Editor

#FB3860 · #A6425A · #3F1427 · #F45C4F · #FD9780

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#FB3860

Vermilion · Tomato · Passion Red

HEX
#FB3860
RGB
rgb(251, 56, 96)
HSL
hsl(348, 96%, 60%)
HSB
hsb(348, 78%, 98%)
CMYK
cmyk(0%, 78%, 62%, 2%)
Oklch
oklch(65.2% 0.227 15.4)

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

#A6425A

Crimson · Sienna · Passion Red

HEX
#A6425A
RGB
rgb(166, 66, 90)
HSL
hsl(346, 43%, 45%)
HSB
hsb(346, 60%, 65%)
CMYK
cmyk(0%, 60%, 46%, 35%)
Oklch
oklch(52.0% 0.133 8.1)

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

#3F1427

Dark Violet · DarkSlateGray · Raspberry

HEX
#3F1427
RGB
rgb(63, 20, 39)
HSL
hsl(333, 52%, 16%)
HSB
hsb(333, 68%, 25%)
CMYK
cmyk(0%, 68%, 38%, 75%)
Oklch
oklch(26.7% 0.071 355.5)

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

#F45C4F

Peach Pink · Tomato · Coral Red

HEX
#F45C4F
RGB
rgb(244, 92, 79)
HSL
hsl(5, 88%, 63%)
HSB
hsb(5, 68%, 96%)
CMYK
cmyk(0%, 62%, 68%, 4%)
Oklch
oklch(67.2% 0.189 28.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FD9780

Peach Pink · LightSalmon · Coral Red

HEX
#FD9780
RGB
rgb(253, 151, 128)
HSL
hsl(11, 97%, 75%)
HSB
hsb(11, 49%, 99%)
CMYK
cmyk(0%, 40%, 49%, 1%)
Oklch
oklch(77.7% 0.128 33.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FB3860
37FBD4

Analogous

FB37C0
FB3860
FB7237

Triadic

FB3860
5EFB37
375EFB

Split-Comp.

FB3860
37FB72
37C0FB

Tetradic

FB3860
C0FB37
37FBD4
7237FB

Contrast Matrix WCAG 2.1 Contrast

FB3860
A6425A
3F1427
F45C4F
FD9780
—
1.6
Fail
4.4
AA Large
1.1
Fail
1.7
Fail
1.6
Fail
—
2.6
Fail
1.8
Fail
2.8
Fail
4.4
AA Large
2.6
Fail
—
4.8
AA
7.4
AAA
1.1
Fail
1.8
Fail
4.8
AA
—
1.5
Fail
1.7
Fail
2.8
Fail
7.4
AAA
1.5
Fail
—
White BG
3.6AA Large
5.9AA
15.7AAA
3.2AA Large
2.1Fail
Black BG
5.8AA
3.5AA Large
1.3Fail
6.5AA
9.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A556
7B7A54
2C2C22
B2B152
D1D086

Deuteranopia

B2C154
818853
2F3221
BBC653
D7DE87

Tritanopia

F14F4D
A1504F
3D1F1E
EC5555
F88A8B

Achromatopsia

777777
636363
232323
888888
B3B3B3

Shades & Tints Shades & Tints

#FB3860

Dark
Light

#A6425A

Dark
Light

#3F1427

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fb3860;
  --color-2: #a6425a;
  --color-3: #3f1427;
  --color-4: #f45c4f;
  --color-5: #fd9780;
}

SCSS

$color-1: #fb3860;
$color-2: #a6425a;
$color-3: #3f1427;
$color-4: #f45c4f;
$color-5: #fd9780;

TAILWIND

colors: {
  'brand-1': '#fb3860',
  'brand-2': '#a6425a',
  'brand-3': '#3f1427',
  'brand-4': '#f45c4f',
  'brand-5': '#fd9780',
}

RGB Array

[251, 56, 96], [166, 66, 90], [63, 20, 39], [244, 92, 79], [253, 151, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FB3860, #A6425A, #3F1427, #F45C4F, #FD9780 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #fb3860; --color-2: #a6425a; --color-3: #3f1427; --color-4: #f45c4f; --color-5: #fd9780. 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. 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