Carnelian
Meet Carnelian (#B31B1B), a striking shade that balances the intensity of red with the stability of brown. Its notable depth gives it a strong visual presence, making it a compelling choice for creating focal points and sophisticated accents in any interface.
What color is Carnelian?
Carnelian is a deep, warm red characterized by its rich, earthy undertones.
It occupies a sophisticated space between a pure, vibrant red and a grounded brown, giving it a stable yet potent appearance.
What meaning does Carnelian convey in user interfaces?
Named after the gemstone, the color Carnelian has long been associated with courage, creativity, and endurance.
The shade #B31B1B projects a grounded warmth and vitality, inspiring feelings of confidence and motivation in a design.
How can I use Carnelian in UI design?
In UI design, Carnelian shines as a potent accent color. Its intensity makes it perfect for critical elements like call-to-action buttons, notifications, or error states where you need to capture immediate attention. To balance its strength, pair it with muted neutrals like charcoal, beige, or deep navy. Applying the 60-30-10 principle, where Carnelian (#B31B1B) serves as the 10% highlight, can create a sophisticated and focused user experience.
A shade similar to Carnelian is wielded by assertive brands like Netflix, Chipotle, The Athletic, and Grubhub. These companies use this powerful red to signal energy and make a bold statement. Its use by such prominent names shows its effectiveness, yet it remains distinctive enough to help a product stand out visually in a crowded market.
To see how Carnelian works in practice, use the tools below. You can explore curated color palettes, check contrast ratios for accessibility, and even preview how #B31B1B looks within the actual UI components of well-known apps.
How do I use the Carnelian color codes?
The most direct way to specify the color Carnelian in a digital project is with its hex code, #B31B1B. This six-digit code is the standard for web design, but its usefulness extends beyond just CSS or HTML.
Different design mediums call for different color models. For digital screens, you'll often use RGB (Red, Green, Blue) values, which create color by mixing light. For print materials, the CMYK (Cyan, Magenta, Yellow, Key/Black) model is standard, as it defines colors through mixed inks. You can translate #B31B1B into these and other formats like HSL or LAB to suit your project's requirements.
We've converted #B31B1B into a range of popular formats below. Simply find the code you need and copy it directly into your design tool.
Analogous
Sitting beside Carnelian on the color wheel, analogous colors produce a rich, cohesive palette. This combination results in a calm and composed visual experience.
Complementary
Complementary colors are opposites on the color wheel. Paired with Carnelian, its complement creates a striking visual contrast, making both hues appear more vibrant.
Split Complementary
A split complementary palette offers a sophisticated twist on a classic. It pairs Carnelian with the two colors that sit beside its direct opposite.
Triadic
A triadic scheme pairs Carnelian with two other colors, all equally distant on the color wheel, resulting in a bold and balanced combination.
Tetradic
A tetradic scheme pairs Carnelian with three other colors, forming two complementary sets for a rich, versatile, and well-balanced design palette.
Square
The square color scheme uses four colors evenly spaced on the color wheel. With Carnelian, this creates a rich, high-contrast, and lively palette.
Text Color
Background Color
Your Catchy Large Text Goes Here
Shades
By adding black to Carnelian, you create shades—darker tones that add visual weight.
Tints
Tints are lighter versions of Carnelian, created by adding white to soften the original hue.
Tones
Tones are created by adding gray to Carnelian, resulting in softer, less saturated versions.
Hues
Hues are variations of Carnelian, differing in intensity and temperature to influence visual tone.
Never run out of inspiration again.
Use Mobbin for free as long as you like or get full access with any of our paid plans.
