Ultramarine Blue
Meet Ultramarine Blue (#4166F5), a vivid shade that commands attention. Its intense saturation and position near violet on the color spectrum give it a unique electric quality, making it a powerful choice for any design palette that needs a strong, modern accent.
What color is Ultramarine Blue?
Ultramarine Blue is a deep, vibrant blue with a distinct reddish undertone.
This gives it a slightly warmer temperature than many other blues, leaning towards violet on the color spectrum.
What meaning does Ultramarine Blue convey in UI/UX design?
Historically derived from the rare lapis lazuli stone, Ultramarine Blue was once more precious than gold, symbolizing divinity, royalty, and immense value in Renaissance art.
Today, the color #4166F5 projects a sense of profound stability, trust, and intelligence, making it a powerful choice for communicating authority and sophistication.
How can I effectively use Ultramarine Blue (#4166F5) in my UI design?
In UI design, Ultramarine Blue excels as a primary color for calls-to-action, interactive elements, and branding accents. For a clean, professional look, set it against a backdrop of crisp whites and cool grays to ensure high contrast and readability. To create a more energetic composition, try a split-complementary palette by introducing warm yellows or oranges, which adds vibrancy without feeling jarring.
This particular shade of blue is a popular choice in the tech world. Brands like Miro, Discord, Canva, and Airtasker use similar hues to communicate both reliability and creative energy. Its presence in apps from Eventbrite to Habitify shows its versatility across different product categories.
To see how Ultramarine Blue performs in practice, use the tools below. You can explore curated palettes, test color contrast ratios for accessibility, and preview how it looks within the UI components of leading apps.
Using Ultramarine Blue color codes
When working with Ultramarine Blue, the hex code #4166F5 is your starting point for any digital project. This code is universally recognized in CSS, HTML, and design software, making it the most direct way to specify the color for web and app interfaces.
While HEX is standard for the web, you'll often need to convert #4166F5 into other formats. RGB (Red, Green, Blue) values define the color for on-screen displays, while CMYK (Cyan, Magenta, Yellow, Key/Black) is essential for print materials. For more intuitive color adjustments, HSL (Hue, Saturation, Lightness) allows you to tweak aspects of the color without starting from scratch.
To make your workflow easier, we've converted Ultramarine Blue's #4166F5 hex code into its corresponding RGB, CMYK, HSL, and other values. You can find and copy these codes directly from the list below.
Analogous
Analogous colors sit next to Ultramarine Blue on the color wheel, producing a cohesive and serene palette that feels naturally balanced.
Complementary
To find Ultramarine Blue's complement, look to the opposite side of the color wheel. This pairing produces a vibrant, energetic look with maximum contrast.
Split Complementary
A split complementary scheme for Ultramarine Blue pairs it with the two colors neighboring its opposite, creating a high-contrast look with less tension.
Triadic
A triadic scheme pairs Ultramarine Blue with two other colors, all equidistant on the color wheel, for a bold and balanced effect.
Tetradic
For a rich palette, a tetradic scheme pairs Ultramarine Blue with three other colors, creating two sets of complementary colors on the color wheel.
Square
A square color scheme uses four colors evenly spaced on the color wheel. With Ultramarine Blue as the base, this creates a vibrant, high-contrast palette.
Text Color
Background Color
Your Catchy Large Text Goes Here
Shades
Shades of Ultramarine Blue are made by adding black, creating darker, weightier tones.
Tints
Tints are lighter versions of Ultramarine Blue, created by adding white for a softer appearance.
Tones
Tones are created by mixing Ultramarine Blue with gray for a less saturated, softer appearance.
Hues
Hues are variations of Ultramarine Blue, differing in intensity or temperature to create distinct moods.
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.



































































































































