Ultramarine
General Information about Ultramarine
Ultramarine, represented by the hexadecimal color code #170FA4, is a deep blue color known for its rich and vibrant hue. Historically, ultramarine pigment was derived from the semi-precious stone lapis lazuli, making it one of the most expensive and highly prized pigments during the medieval and Renaissance periods. In modern color theory, ultramarine is considered a cool color, often associated with feelings of calmness, stability, and intelligence. It is widely used in various applications, ranging from digital design and web development to fine art and fashion. Its intense saturation allows it to stand out and add depth to designs. Ultramarine bridges the gap between traditional artistry and modern application, making it a color of timeless appeal.
The contrast ratio of #170FA4 (Ultramarine) with white text is approximately 11.9:1, which exceeds the recommended WCAG (Web Content Accessibility Guidelines) AAA standards for text and non-text contrast. This means white text on an Ultramarine background is highly legible for most users, including those with visual impairments. Conversely, using black text on an Ultramarine background results in a contrast ratio of only 1.76:1, failing to meet accessibility standards. Therefore, black text should be avoided. When using Ultramarine in designs, prioritize light or pale-colored text and interface elements to ensure optimal readability and usability for all users. Also, consider providing alternative color schemes for users with specific needs.
Shades
Digital Color Formats
Alternative colors
A slightly lighter shade of blue that maintains a similar aesthetic but offers a bit more brightness.
A deeper, more saturated blue that provides a bolder and more intense visual impact.
A muted, pastel blue for backgrounds that need a touch of color without overwhelming the space
Applications
Web Design: Call-to-Action Buttons
Ultramarine is an excellent choice for call-to-action buttons and links, as its vibrancy and distinct color make it easily noticeable and clickable. Its depth makes it ideal for creating a sense of trust and importance. For example, a website for a financial institution might use Ultramarine for key buttons to inspire confidence.
Brand Identity and Logo Design
Ultramarine can be used as the primary color in a brand's identity to communicate sophistication, reliability, and intelligence. When used for logo designs, marketing materials, and website themes, the hue helps create a professional and trustworthy image. Many tech companies use ultramarine in their brand identity.
Interior Design: Accent Color
In interior design, Ultramarine can be used as an accent color for walls, furniture, or accessories to create a sophisticated and calming atmosphere. It pairs well with neutral colors such as gray, white, and beige. For a study it might promote focus, and can be very calming in a bathroom.