Ultramarine
General Information about Ultramarine
Ultramarine, represented by the hexadecimal color code #08019A, is a deep, vivid blue color reminiscent of the pigment derived from lapis lazuli. Historically, ultramarine pigment was highly prized and expensive, making it a color associated with royalty and luxury. In the RGB color model, #08019A consists of 3.14% red, 0.39% green, and 60.78% blue. In the CMYK color model, it is composed of 95% cyan, 99% magenta, 0% yellow, and 39% black. This color falls within the blue color family and is often used to convey feelings of trust, stability, and intelligence. Ultramarine is frequently employed in graphic design, web design, and branding to evoke a sense of professionalism and sophistication. It is very popular in many areas, such as sports, software, education, science and medicine.
The hex color #08019A, also known as Ultramarine, presents some accessibility challenges, particularly in web design. Due to its deep, saturated hue and low luminance, it offers insufficient contrast when paired with lighter colors like white or yellow for text. Using #08019A as a background color with light text may cause readability issues for users with visual impairments or color blindness. To ensure accessibility, it's crucial to select contrasting colors carefully. A contrast ratio of at least 4.5:1 is recommended for normal text and 3:1 for large text, as per WCAG guidelines. Lighter shades of yellow, orange or green should be avoided. Testing color combinations with accessibility tools is essential to meet accessibility standards and provide an inclusive user experience. Consider using tools like WebAIM's Contrast Checker to verify contrast ratios and explore alternative color combinations that offer better readability and visual clarity.
Shades
Digital Color Formats
Alternative colors
A slightly lighter shade of blue that maintains the ultramarine feel while offering better contrast with lighter text.
A more desaturated blue that is easier on the eyes when used as a background color.
This color works well with the ultramarine color, and provides a nice contrast for accessibility.
Applications
Web Development and UI Design
In web development, #08019A (Ultramarine) can be used to create a sense of sophistication and depth. It's suitable for headers, navigation bars, or as an accent color to draw attention to specific elements. In user interface design, Ultramarine can be used for buttons or icons, conveying a sense of trust and reliability. However, care must be taken to ensure sufficient contrast with text and other elements to meet accessibility standards. For example, pairing it with white or very light yellow can create a visually appealing contrast, but the contrast ratio should be checked. Ultramarine could also be used as a background for data visualization elements. To have an accessible result, one must pair it with white, orange, yellow or other accessible colors.
Fashion, Interior Design, and Beauty
In fashion, Ultramarine can be used in garments or accessories to add a bold and elegant touch. It works well as a statement color or as part of a larger color palette. For example, an Ultramarine dress can be paired with silver or gold accessories for a sophisticated look. In interior design, Ultramarine can be used as an accent wall color or in decorative elements such as pillows or curtains. It can create a sense of calm and tranquility, especially when combined with neutral colors like white or gray. Using ultramarine, a living room or bedroom gets a cool, elegant touch. In beauty, Ultramarine can be used in eye shadows, nail polishes, or as a hair color to add a vibrant and unique touch. It is a great accent color to many other colors and styles.
Data Visualizations
Ultramarine is a great color for data visualizations when you want to deliver elegance and formality. Because this is a darker color, it can be easily combined with other accessible colors for the text, titles, axis and legends. The color creates an intuitive and calm feeling when viewing the data.