Ultramarine
General Information about Ultramarine
Ultramarine, represented by the hexadecimal code #170C8F, is a deep shade of blue that evokes feelings of serenity, wisdom, and stability. Historically, it was derived from the precious stone lapis lazuli, making it one of the most expensive and highly prized pigments used by Renaissance artists. The name "ultramarine" literally means "beyond the sea," reflecting its origin from across the seas. Today, it is synthetically produced, making it more accessible. In the RGB color model, #170C8F consists of 9.02% red, 4.71% green, and 56.08% blue. Its hue angle is 246.7 degrees, saturation is 83.21%, and lightness is 30.39%. This rich and captivating color continues to be valued in various applications, from art and design to fashion and branding, due to its depth and sophistication.
The color #170C8F, a deep ultramarine, presents some accessibility challenges. Its low luminance of 2.46 cd/m² results in a very low contrast ratio of 3.01:1 against white, failing WCAG standards for normal text (4.5:1) and large text (3:1). Using this color for text on a white background would be difficult for users with visual impairments to read. To improve accessibility, consider using a lighter background color or a lighter shade of blue. Alternatively, pair #170C8F with a vibrant, contrasting color like yellow or orange for graphical elements, ensuring sufficient size and clear distinction. Providing alternative text descriptions for images or using ARIA attributes can further enhance accessibility for screen reader users. When using this color in interactive elements, ensure that sufficient visual cues are present to indicate focus and state changes. Testing with accessibility tools can help identify and address potential issues before deployment.
Shades
Digital Color Formats
Alternative colors
A slightly lighter shade of blue that offers improved contrast against white backgrounds, enhancing readability for users with visual impairments while maintaining a similar aesthetic appeal.
A brighter blue that complements #170C8F well when used as an accent color, providing a visually appealing contrast without compromising accessibility standards.
A darker shade of blue with slightly higher luminance, this can be used on lighter backgrounds to improve the color contrast.
Applications
Web Design
Ultramarine, reminiscent of deep ocean waters and twilight skies, is excellent for crafting immersive website designs. Its depth evokes feelings of trust, stability, and intelligence. Employ this color in headers and footers to create a sense of authority, or use it sparingly as an accent to highlight critical information. In user interfaces, Ultramarine can serve as a primary color for buttons and navigation menus, instilling confidence in the user. Its calming nature makes it suitable for educational platforms, scientific journals, and websites focused on meditation and relaxation. The rich and regal nature allows it to be used in luxury branding and sophisticated digital products, and pairing it with light, complimentary colors such as yellows and oranges will create visual contrast.
Interior Design & Fashion
Ultramarine offers a touch of elegance to interior spaces when utilized thoughtfully. Consider painting an accent wall to add depth and sophistication to a living room or bedroom. Integrate this color in home decor items such as throw pillows, rugs, or artwork to complement neutral tones. In fashion, Ultramarine can be incorporated into evening wear, scarves, or statement jewelry, making a stylish statement. To create a striking visual effect, pair ultramarine clothing with accessories in contrasting colors such as gold or silver. Its rich and captivating nature lends sophistication and a sense of depth and should be paired with lighter, and more neutral, shades to create balance.
Graphic Design
In the realm of graphic design, ultramarine shines as a versatile and commanding hue. It's excellent for designing logos for tech companies or educational institutions. It can be used to create striking posters or book covers. When combined with bright yellows and oranges, it can draw attention to the important information that will capture and engage the audience. For data visualizations, ultramarine can effectively represent critical data points, due to the depth and seriousness the color presents. It can add elegance, confidence, sophistication and visual depth to designs. This makes it a great color for graphic designers looking for an eye catching color.