Figma color wheel
Want to find the perfect complementary or analogous colors to match vermilion?
Skip to main content
Everything you need to know about vermilion to inspire your next design.
Vermilion is a rich, vibrant shade of red with warm and energetic qualities. Like other red shades, vermilion symbolizes strength, passion, and love while carrying connotations of danger and power.

Shades
Tints
Tones
Hues
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Circus Tent
Exotic Bird
Sangria
Vermilion is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
Here are some ways to use vermilion in your designs:
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
For variations within the same bold spectrum as vermilion, consider:
To complement vermilion, consider pairing it with:
Other colors worth considering include neutral tones like cream or gray for a softer look or complementary colors like turquoise to enhance its vibrancy.
While vermilion is bold and fiery, it may clash with:
Vermilion symbolizes passion, energy, and excitement. The color has cultural significance in many societies, representing everything from good fortune to spiritual energy.
In color psychology, vermilion is considered stimulating and attention-grabbing. It evokes feelings of warmth, enthusiasm, and desire. This fiery color can also be associated with importance.
In UI design, vermilion can create a sense of excitement and urgency. It effectively draws attention to CTAs, highlights progress, and conveys energy and vitality. However, it’s crucial to use it sparingly to avoid overwhelming the design.
Vermilion’s origins trace back to ancient civilizations in China, where it was used it for ceremonial and artistic purposes.
The pigment was traditionally made from cinnabar, a mineral containing mercury sulfide. Due to its toxicity, producing vermilion was hazardous, adding to its value.
Various cultures have used vermilion for painting, sculpture, and decorative arts. Its vivid color and historical significance have ensured its popularity. Today, synthetic vermilion is now available, removing the health risks once associated with its production.
Contrast 4.32
#E73121
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Pass | Fail | |
Pass | Fail |
Contrast 4.86
#E73121
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Fail | |
Pass | Pass | |
Pass | Pass |
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #E73121, known as vermilion, has RGB values of R:231, G:49, B:33 and CMYK values of C:0, M:0.79, Y:0.86, K:0.09.
| VALUE | CSS | |
|---|---|---|
| HEX | E73121 | #E73121 |
| RGB DECIMAL | 231, 49, 33 | RGB(231,49,33) |
| RGB PERCENTAGE | 90.6, 19.2, 12.9 | RGB(90.6%,19.2%,12.9%) |
| CMYK | 0, 79, 86, 9 | |
| HSL | 4.8°, 80.5, 51.8 | HSL(4.8°,80.5%,51.8%) |
| HSV (OR HSB) | 4.8°, 85.7, 90.6 | |
| WEB SAFE | FF3333 | #FF3333 |
| CIE-LAB | 51.036, 67.131, 52.869 | |
| XYZ | 34.33, 19.3, 3.356 | |
| xyY | 0.602, 0.339, 19.3 | |
| CIE-LCH | 51.036, 85.45, 38.222 | |
| CIE-LUV | 51.036, 141.6, 34.421 | |
| HUNTER-LAB | 43.931, 62.607, 26.222 | |
| BINARY | 11100111, 00110001, 00100001 | |
| iOS - SwiftUI | Color(red: 0.906, green: 0.192, blue: 0.129) | |
| iOS - UIKit | UIColor(red: 0.906, green: 0.192, blue: 0.129, alpha: 1) | |
| Android - Compose | Color(0xFFE73121) |
Want to find the perfect complementary or analogous colors to match vermilion?
Embrace the deep and vibrant color of cherry.
Discover the passion and spark of scarlet.