Ultramarine
About Ultramarine (#220BA8)
The hexadecimal color code #220BA8 represents a deep shade of ultramarine blue. It is composed of 13.3% red, 4.3% green, and 65.9% blue. In the RGB color model, this translates to 34 red, 11 green, and 168 blue. Ultramarine, traditionally derived from the gemstone lapis lazuli, is known for its intense and vibrant blue hue. In the context of light, #220BA8 has a relatively low luminance value, making it appear quite dark. The color is often associated with depth, sophistication, and intelligence. It carries a sense of stability and trustworthiness. In art and design, it is commonly used to evoke feelings of calm, peace, and contemplation, with a strong cultural and historical significance.
The color #220BA8, a deep ultramarine, presents some accessibility challenges due to its low luminance. When used as a background color, it requires a very light text color to ensure sufficient contrast for readability, meeting WCAG standards for text legibility. Ideally, a text color like #FFFFFF (white) or a very pale yellow would be suitable. Using darker text colors, such as grays or blacks, would make the text difficult, if not impossible, for many users to read comfortably, particularly those with visual impairments. In interface design, avoid using this color for crucial interactive elements unless accompanied by clear visual cues and sufficient contrast ratios. Consider providing alternative high-contrast themes or color customization options to accommodate users with different visual needs. Larger font sizes and bolder text weights can also slightly improve readability against this dark background, but contrast should remain the primary consideration.
Shades
Digital Color Formats
Alternative colors
A slightly lighter shade that maintains the ultramarine feel but offers improved contrast when paired with darker text.
A more desaturated blue that is less intense and provides a softer visual experience.
A dark blue that offers a similar aesthetic but could provide slightly better contrast depending on the specific application.
Applications
Web Design Accent
In web design, ultramarine can be used as a background color for headers or footers to create a sophisticated and professional look. It can also be employed as an accent color for buttons and links, especially when aiming for a modern and tech-oriented feel. However, caution is needed to ensure sufficient contrast with text and other elements. It is well-suited for themes related to technology, education, and finance, creating a sense of authority and trust. Consider using it sparingly to highlight important sections or calls to action.
Fashion Statement
Ultramarine is a bold choice for fashion, often seen in evening wear and statement pieces. It pairs well with metallics like silver and gold for a glamorous effect, or with contrasting colors like yellow or orange for a more vibrant and playful look. Because of its depth and richness, it can be a flattering color for a variety of skin tones, adding a touch of elegance and sophistication. Consider using it in accessories like scarves or handbags to add a pop of color to a neutral outfit.
Interior Accent
In interior design, ultramarine can be used as an accent wall color in a living room or bedroom to create a focal point. It can also be incorporated through furniture pieces like sofas or armchairs. When used in smaller doses, such as cushions or artwork, it adds a touch of richness and depth to the space. Complementary colors like yellow or gold can be used to balance the intensity of the ultramarine and create a harmonious atmosphere. The color promotes relaxation and is often found in wellness environments.