Ultramarine
About Ultramarine (#170EA5)
The hexadecimal color code #170EA5 represents a dark shade of blue-violet, often referred to as Ultramarine. It's composed of 9.02% red, 5.49% green, and 64.71% blue. In the RGB color model, this translates to R:23, G:14, B:165. The corresponding CMYK values are C:86, M:92, Y:0, K:35. This color falls within the blue-purple range of the color spectrum. Ultramarine, historically derived from the precious stone lapis lazuli, has been a prized pigment for centuries, known for its deep, rich hue. In modern digital applications, it evokes feelings of sophistication, mystery, and creativity. Due to its dark nature, it should be used carefully in designs, particularly concerning accessibility and readability.
The color #170EA5, a deep ultramarine, presents significant accessibility challenges, particularly for users with visual impairments. Its low lightness value (approximately 6%) means it offers insufficient contrast against common background colors like white or light gray. This lack of contrast can make text and graphical elements difficult or impossible to read for individuals with low vision. To improve accessibility, it is crucial to pair this color with much lighter shades. White (#FFFFFF) or very light grays can provide the necessary contrast ratio to meet WCAG (Web Content Accessibility Guidelines) standards. For text elements, adhering to a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text is recommended. Using a color contrast checker tool is essential during the design process to ensure compliance and create a more inclusive user experience. Avoid using this color for critical UI elements without careful consideration of contrast.
Shades
Digital Color Formats
Alternative colors
A slightly lighter shade of blue that offers improved readability and maintains a similar aesthetic.
A brighter blue-purple that provides more vibrancy and better contrast against light backgrounds.
A deep indigo that still delivers a dark impression, but is more balanced regarding accessibility when combined with yellow.
Applications
Website Design
In web development, #170EA5 can be effectively used for creating a sophisticated and modern aesthetic. It works well for website headers, navigation menus, and background accents, especially when aiming for a luxurious or technological feel. However, caution should be exercised when using it for text, as its dark nature necessitates high-contrast pairings with lighter colors like white or pale yellow to ensure readability. To do it properly you must use a tool to measure the contrast between the text and its background.
Fashion Design
In the fashion industry, #170EA5 can be used as a striking color for evening wear or statement pieces. Its depth and richness make it suitable for luxurious fabrics like velvet or silk. It also works well as an accent color in accessories such as scarves, handbags, or jewelry, adding a touch of sophistication to an outfit. To use this color effectively, combine it with neutrals like black, gray, or white to create balance and allow the color to truly stand out.
Interior Design
When used in interior design, #170EA5 can create a dramatic and elegant atmosphere. It is well suited for accent walls, upholstery, or decorative elements in living rooms, bedrooms, or home offices. To create a cosy atmosphere, this color could be well combined with warm neutrals, metallic accents, or natural wood tones. To prevent the room from feeling too dark, it is crucial to use this color in moderation and incorporate plenty of light through lamps and windows.