What color is dark blue?
Dark blue is a deep, intense shade of blue characterized by its mysterious allure. It’s positioned on the cooler end of the color spectrum and conjures images of midnight skies and vast oceans, evoking feelings of tranquility and depth.
What does dark blue look like on digital screens?
Dark blue is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- HEX code: #111184
- RGB value: 6.7% red, 6.7% green, and 51.8% blue
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
How should I effectively use dark blue in UI design?
Here are some ways to use dark blue in your designs:
- Pay attention to contrast and balance. Too much dark blue can make a design feel too dark. Consider pairing dark blue with a lighter shade of blue or white to add a sense of balance that doesn’t overwhelm the viewer.
- Establish a visual hierarchy. Darker colors are perfect for creating a visual hierarchy. Use dark blue to highlight lower-priority elements, like a background.
- Consider accessibility. When working with darker colors in UI design, it’s essential to consider visual contrast, like text on a background. Consider using lighter contrasting colors that allow elements to show clearly.
- Embrace the dark side. Modern applications and websites offer dark modes for their user interfaces. Use dark blue for dark mode backgrounds to make viewing easier on the eyes, especially at night.
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
What are similar colors to dark blue?
For variations within the same deep, rich spectrum as dark blue, consider:
- Navy blue (#000080) is similar to dark blue but slightly lighter in appearance with a touch of gray, offering a sophisticated, calming option.
- Deep purple (#800080) doesn’t sit directly within the blue family but provides an equivalent feeling of bold richness and depth.
- Hunter green (#355E3B) moves into the green family of colors. Like dark blue, it’s a shade that offers a stable, calming emotion.
- Royal blue (#305CDE) is a brighter, vibrant shade of blue that offers a similar regal tone that, when paired with dark blue, can provide light contrast within UI design.
What colors go with dark blue?
To complement dark blue, consider pairing it with:
- Emerald green (#00674F) works well with dark blue, offering a luxurious, royal color scheme.
- Burgundy (#660033) is another darker tone that pairs well with dark blue, creating a sense of richness and depth.
- Cream (#FDFBD4) contrasts with dark blue, offering a gentler option than white.
- Coral (#FF8559) and dark blue combine to create a theme reminiscent of the ocean and reefs.
Other colors worth considering include gray for a simple, sophisticated appearance and copper to instill a bit of warmth within a rich palette.
What colors conflict with dark blue?
While dark blue is versatile, it may clash with:
- Neon Orange (#FF5F1F) will clash with dark blue due to its stark contrast and bright, harsh intensity.
- Neon green (#2CFF05) is another incredibly bright color that clashes with dark blue, creating an overwhelming visual.
- Bright purple (#BF40BF) has traces of blue, but its bold color can be overpowering when paired with dark blue.
- Electric blue (#00F0FF) proves that blue doesn’t always go with blue; this shade is too intense to pair with dark blue.
- Vibrant coral (#FF6F61) is too intensely saturated to pair with dark blue, unlike its one-word color counterpart, coral.
What does dark blue symbolize?
Dark blue symbolizes stability and calmness. In Chinese culture, dark blue is associated with longevity and immortality. The ancient Greeks associated dark blue with the god Zeus, symbolizing wisdom and authority. Indigenous Americans regard dark blue as a symbol of the night sky and spiritual realm.
In colo psychology, dark blue can evoke feelings of tranquility and deep reflection. It can also instill emotions of trust and reliability. It is commonly associated with the vast depths of the ocean and dark night sky.
In UI design, dark blue can be used as a background to instill a feeling of trust and safety, such as with banking apps, healthcare websites, and e-commerce platforms.
What’s the history of dark blue?
The name “dark blue” is rooted in the English language and refers to a darker, more intense version of the color blue. The primary blue color has deeper roots in the French language as “bleu” and in the Proto-Indo-European language as the root “bhel,” which means “to shine.”
The ancient Egyptians used shades of blue to paint ceramics, statues, and the tombs of pharaohs. In the 19th century, dark blue saw deeper integration into military uniforms due to its association with authority.
Color variations
Shades
Tints
Tones
Hues
Color harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom palettes
Deep Sapphire
Mystic Meadows
Nebula
Accessibility
Contrast checker
14.61:1
WCAG 2.2 Simple Contrast
Normal Text
- Pass
- AA
- 4.5:1
- Pass
- AAA
- 7:1
Large Text
- Pass
- AA
- 3:1
- Pass
- AAA
- 4.5:1
1.44:1
WCAG 2.2 Simple Contrast
Normal Text
- Fail
- AA
- 4.5:1
- Fail
- AAA
- 7:1
Large Text
- Fail
- AA
- 3:1
- Fail
- AAA
- 4.5:1
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
Color conversion
The hexadecimal color #111184, known as dark blue, has RGB values of R:17, G:17, B:132, and CMYK values of C:87, M:87, Y:0, K:48.
VALUE | CSS | |
---|---|---|
HEX | #111184 | #111184 |
RGB DECIMAL | 17, 17, 132 | RGB(17, 17, 132) |
RGB PERCENTAGE | 6.7, 6.7, 51.8 | RGB(6.7%, 6.7%, 51.8%) |
CMYK | 87, 87, 0, 48 | |
HSL | 240°, 77, 29 | HSL(240, 77%, 29%) |
HSV (OR HSB) | 240°, 87.9, 51.8 | |
WEB SAFE | #000099 | #000099 |
CIE-LAB | 16.433, 42.357, -61.455 | |
XYZ | 4.596, 2.186, 22.008 | |
xyY | 0.16, 0.076, 2.186 | |
CIE-LCH | 16.433, 74.638, 304.576 | |
CIE-LUV | 16.433, -4.287, -59.411 | |
HUNTER-LAB | 14.784, 29.615, -77.913 | |
BINARY | 00010001, 00010001, 10000100 | |
iOS - SwiftUI | Color(red: 0.067, green: 0.067, blue: 0.518) | |
iOS - UIKit | UIColor(red: 0.067, green: 0.067, blue: 0.518, alpha: 1.0) | |
Android - Compose | 0xFF111184 |