← Back to Editor

#C01831 · #FA3F5B · #E2F0D7 · #78A849 · #416919

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

#C01831

Vermilion · FireBrick · Passion Red

HEX
#C01831
RGB
rgb(192, 24, 49)
HSL
hsl(351, 78%, 42%)
HSB
hsb(351, 88%, 75%)
CMYK
cmyk(0%, 88%, 74%, 25%)
Oklch
oklch(51.9% 0.197 21.5)

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

#FA3F5B

Peach Pink · Tomato · Coral Red

HEX
#FA3F5B
RGB
rgb(250, 63, 91)
HSL
hsl(351, 95%, 61%)
HSB
hsb(351, 75%, 98%)
CMYK
cmyk(0%, 75%, 64%, 2%)
Oklch
oklch(65.5% 0.221 18.0)

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

#E2F0D7

Celadon · Beige · Mint Green

HEX
#E2F0D7
RGB
rgb(226, 240, 215)
HSL
hsl(94, 45%, 89%)
HSB
hsb(94, 10%, 94%)
CMYK
cmyk(6%, 0%, 10%, 6%)
Oklch
oklch(93.8% 0.036 131.2)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#78A849

Celadon · Gray · Olive Green

HEX
#78A849
RGB
rgb(120, 168, 73)
HSL
hsl(90, 39%, 47%)
HSB
hsb(90, 57%, 66%)
CMYK
cmyk(29%, 0%, 57%, 34%)
Oklch
oklch(67.6% 0.136 131.5)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#416919

Pine Green · DarkOliveGreen · Forest Green

HEX
#416919
RGB
rgb(65, 105, 25)
HSL
hsl(90, 62%, 25%)
HSB
hsb(90, 76%, 41%)
CMYK
cmyk(38%, 0%, 76%, 59%)
Oklch
oklch(47.4% 0.117 132.6)

Traditional「Pine Green」· Paint「Forest Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C01831
18BFA6

Analogous

BF1884
C01831
BF5218

Triadic

C01831
31BF18
1831BF

Split-Comp.

C01831
18BF52
1884BF

Tetradic

C01831
84BF18
18BFA6
5218BF

Contrast Matrix WCAG 2.1 Contrast

C01831
FA3F5B
E2F0D7
78A849
416919
—
1.7
Fail
5.2
AA
2.2
Fail
1.0
Fail
1.7
Fail
—
3.0
Fail
1.3
Fail
1.8
Fail
5.2
AA
3.0
Fail
—
2.4
Fail
5.4
AA
2.2
Fail
1.3
Fail
2.4
Fail
—
2.3
Fail
1.0
Fail
1.8
Fail
5.4
AA
2.3
Fail
—
White BG
6.1AA
3.5AA Large
1.2Fail
2.8Fail
6.4AA
Black BG
3.4AA Large
5.9AA
17.7AAA
7.5AAA
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

77762B
A9A754
E8E8DD
8D8D60
52532C

Deuteranopia

818E2A
B4C253
E7E6DF
8A8666
504D31

Tritanopia

B82625
F14F4E
E3E2E3
7A7276
433C3F

Achromatopsia

4D4D4D
7A7A7A
E9E9E9
8F8F8F
545454

Shades & Tints Shades & Tints

#C01831

Dark
Light

#FA3F5B

Dark
Light

#E2F0D7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c01831;
  --color-2: #fa3f5b;
  --color-3: #e2f0d7;
  --color-4: #78a849;
  --color-5: #416919;
}

SCSS

$color-1: #c01831;
$color-2: #fa3f5b;
$color-3: #e2f0d7;
$color-4: #78a849;
$color-5: #416919;

TAILWIND

colors: {
  'brand-1': '#c01831',
  'brand-2': '#fa3f5b',
  'brand-3': '#e2f0d7',
  'brand-4': '#78a849',
  'brand-5': '#416919',
}

RGB Array

[192, 24, 49], [250, 63, 91], [226, 240, 215], [120, 168, 73], [65, 105, 25]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C01831, #FA3F5B, #E2F0D7, #78A849, #416919 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: #c01831; --color-2: #fa3f5b; --color-3: #e2f0d7; --color-4: #78a849; --color-5: #416919. 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