← Back to Editor

#D63142 · #F07C85 · #FFFACF · #8A3030 · #4B301F

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

#D63142

Vermilion · Crimson · Passion Red

HEX
#D63142
RGB
rgb(214, 49, 66)
HSL
hsl(354, 67%, 52%)
HSB
hsb(354, 77%, 84%)
CMYK
cmyk(0%, 77%, 69%, 16%)
Oklch
oklch(57.7% 0.200 21.1)

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

#F07C85

Peach Pink · LightCoral · Coral Red

HEX
#F07C85
RGB
rgb(240, 124, 133)
HSL
hsl(355, 79%, 71%)
HSB
hsb(355, 48%, 94%)
CMYK
cmyk(0%, 48%, 45%, 6%)
Oklch
oklch(72.0% 0.143 16.5)

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

#FFFACF

Fresh Green · Beige · Lemon Cream

HEX
#FFFACF
RGB
rgb(255, 250, 207)
HSL
hsl(54, 100%, 91%)
HSB
hsb(54, 19%, 100%)
CMYK
cmyk(0%, 2%, 19%, 0%)
Oklch
oklch(97.8% 0.056 101.9)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#8A3030

Crimson · Brown · Wine Red

HEX
#8A3030
RGB
rgb(138, 48, 48)
HSL
hsl(0, 48%, 36%)
HSB
hsb(0, 65%, 54%)
CMYK
cmyk(0%, 65%, 65%, 46%)
Oklch
oklch(44.1% 0.123 23.6)

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

#4B301F

Tangerine · DarkOliveGreen · Cinnamon

HEX
#4B301F
RGB
rgb(75, 48, 31)
HSL
hsl(23, 42%, 21%)
HSB
hsb(23, 59%, 29%)
CMYK
cmyk(0%, 36%, 59%, 71%)
Oklch
oklch(33.7% 0.048 52.6)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D63142
33D7C6

Analogous

D73395
D63142
D77433

Triadic

D63142
43D733
3343D7

Split-Comp.

D63142
33D774
3395D7

Tetradic

D63142
95D733
33D7C6
7433D7

Contrast Matrix WCAG 2.1 Contrast

D63142
F07C85
FFFACF
8A3030
4B301F
—
1.8
Fail
4.5
AA
1.7
Fail
2.5
Fail
1.8
Fail
—
2.5
Fail
3.1
AA Large
4.6
AA
4.5
AA
2.5
Fail
—
7.8
AAA
11.4
AAA
1.7
Fail
3.1
AA Large
7.8
AAA
—
1.5
Fail
2.5
Fail
4.6
AA
11.4
AAA
1.5
Fail
—
White BG
4.8AA
2.6Fail
1.1Fail
8.2AAA
12.1AAA
Black BG
4.4AA Large
7.9AAA
19.8AAA
2.5Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F8D3E
BEBD83
FDFDD9
636230
3F3F23

Deuteranopia

98A43D
C5CD82
FDFEDC
686F30
414324

Tritanopia

CE3B3A
EA8181
FFE2E3
863030
4A2627

Achromatopsia

646464
A0A0A0
F7F7F7
4B4B4B
363636

Shades & Tints Shades & Tints

#D63142

Dark
Light

#F07C85

Dark
Light

#FFFACF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d63142;
  --color-2: #f07c85;
  --color-3: #fffacf;
  --color-4: #8a3030;
  --color-5: #4b301f;
}

SCSS

$color-1: #d63142;
$color-2: #f07c85;
$color-3: #fffacf;
$color-4: #8a3030;
$color-5: #4b301f;

TAILWIND

colors: {
  'brand-1': '#d63142',
  'brand-2': '#f07c85',
  'brand-3': '#fffacf',
  'brand-4': '#8a3030',
  'brand-5': '#4b301f',
}

RGB Array

[214, 49, 66], [240, 124, 133], [255, 250, 207], [138, 48, 48], [75, 48, 31]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D63142, #F07C85, #FFFACF, #8A3030, #4B301F 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: #d63142; --color-2: #f07c85; --color-3: #fffacf; --color-4: #8a3030; --color-5: #4b301f. 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