Caviar
Introducing Caviar (#313031), a deep charcoal that stands as a refined alternative to stark black. This near-black shade possesses a subtle complexity, giving it a grounded yet distinguished presence in any palette, perfect for creating high-impact visuals.
What color is Caviar?
Caviar is a deep, charcoal gray that borders on black. It's a shade of off-black, carrying a sophisticated depth that distinguishes it from a pure, flat black.
Look closer, and you'll notice its cool temperature. The color #313031 has subtle magenta undertones, giving it a complex character that feels both grounded and luxurious.
What is the meaning behind the color Caviar (#313031)?
Named after the luxury delicacy, the color Caviar (#313031) embodies sophistication, power, and mystery. It communicates a sense of formality and elegance, making it a choice that feels both classic and authoritative.
Symbolically, Caviar represents stability and substance. It’s a foundational shade that suggests permanence and strength, offering a timeless quality that grounds any creative work.
How can I use the color Caviar in my UI design?
Caviar (#313031) serves as a refined substitute for pure black, offering a softer, more grounded foundation for a design. It excels in creating strong contrast for text and key interface elements against light backgrounds, ensuring excellent legibility. For a striking effect, pair it with a single bright accent color or combine it with desaturated neutrals for a subtle and sophisticated look.
Brands like Squarespace, ASOS, and USA TODAY employ similar deep charcoal shades to project a sense of stability and polish. Using a color like Caviar can align your product with this modern, premium aesthetic, suggesting quality and attention to detail without being overly assertive.
To see how Caviar works in practice, use the tools below. You can explore curated palettes, test color contrast for accessibility, and preview Caviar in real UI components from leading apps.
Using Caviar color codes
While #313031 is the go-to for web development, working across different media requires converting this hex code into other formats. Each color model serves a specific purpose, from digital displays to physical print.
For instance, RGB (Red, Green, Blue) values are fundamental for screen-based projects, defining colors through light. In contrast, CMYK (Cyan, Magenta, Yellow, Key/Black) is the standard for printed materials. Other models like HSL (Hue, Saturation, Lightness) offer a more human-centric way to manipulate color properties.
To help you get started, we’ve converted the hex code for Caviar, #313031, into a range of popular formats. You can find and copy the exact values you need for your project below.
Analogous
Analogous colors are neighbors on the color wheel. When paired with Caviar, they create a harmonious and visually pleasing palette with a serene effect.
Complementary
Complementary colors are direct opposites on the color wheel. When paired with Caviar, they produce a striking, high-contrast effect in any design.
Split Complementary
A split complementary scheme for Caviar uses the two colors adjacent to its direct complement, offering a vibrant yet balanced high-contrast palette.
Triadic
Triadic color schemes use three hues equally spaced on the color wheel. With Caviar as a base, this creates a vibrant, high-contrast palette.
Tetradic
Tetradic palettes pair Caviar with three other hues, creating two complementary sets for a rich and dynamic combination of colors.
Square
A square color scheme pairs Caviar with three other colors, all equidistant on the color wheel, creating a vibrant and high-contrast palette.
Text Color
Background Color
Your Catchy Large Text Goes Here
Shades
Adding black to Caviar creates darker shades, lending a sense of depth and weight.
Tints
By mixing Caviar with white, you create lighter tints that soften its appearance.
Tones
Tones are muted versions of Caviar, created by adding gray to soften its saturation.
Hues
Hues are variations of Caviar, sharing its base color but differing in intensity or temperature.
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.

































































































































