Dark Midnight Blue

Meet Dark Midnight Blue (#003366), a color that offers the depth of black with a sophisticated hint of blue. Its striking quality lies in its ability to appear almost black in some lighting, revealing its rich, cool undertones only upon closer inspection, adding a layer of quiet complexity.

Dark Midnight Blue
#003366
Copy
Copied
Access our full UI & UX library today.
Join for free

What color is Dark Midnight Blue?

Dark Midnight Blue is a profoundly deep shade, sitting on the cusp of black yet distinctly retaining its blue identity. It possesses a cool temperature, characterized by its subtle, almost imperceptible, undertones.

This hue is achieved by saturating a pure blue with black, which mutes its vibrancy and pulls it into the shadows, creating a color that offers depth without being a true neutral.

What is the meaning of the color Dark Midnight Blue (#003366)?

Dark Midnight Blue often symbolizes authority, trust, and intelligence. It carries a sense of seriousness and professionalism, making it a popular choice for corporate identities that want to project stability and integrity.

Psychologically, this deep hue evokes feelings of calm, introspection, and elegance. Its association with the vast night sky lends it an air of mystery and sophistication, suggesting depth and substance.

How do I use Dark Midnight Blue (#003366) in UI design?

Dark Midnight Blue works beautifully as a foundational color for creating depth and focus. For a clean, professional look, pair #003366 with crisp whites or soft grays to make sure text is legible and interfaces feel spacious. For a more striking effect, introduce a vibrant accent—think a pop of coral or a sharp citrus yellow—to guide the user's eye to key actions. This approach fits well within the classic 60-30-10 design rule, where Dark Midnight Blue can serve as the dominant or secondary color.

While not overwhelmingly common, this shade of deep blue is favored by brands aiming for a sophisticated and trustworthy image. Companies like Angi, The Guardian, LARQ, Warby Parker, and Sprout Social use similar tones to build a sense of stability and authority in their digital products.

To see how Dark Midnight Blue performs in practice, use the tools below. You can explore curated palettes, test color contrast for accessibility, and even preview #003366 in UI components from well-known applications.

How do I use Dark Midnight Blue color codes?

Applying Dark Midnight Blue in your work starts with its hex code, #003366, which is standard for web design. However, different projects require different color models. For instance, print jobs depend on CMYK values, while digital screens render colors using RGB.

Each code represents a unique way of building color. RGB mixes red, green, and blue light, ideal for displays. CMYK subtracts from white light using cyan, magenta, yellow, and black inks, which is fundamental for printing. Other models like HSL (Hue, Saturation, Lightness) give designers more intuitive control over color properties.

To make your workflow easier, we have translated the #003366 hex code for Dark Midnight Blue into a variety of popular formats. You can find these values below, ready to copy for your specific application.

Dark Midnight Blue Code Conversions

HEX
#003366
Copy
Copied
LAB
34.74, -20.85, 14.42
Copy
Copied
RGB
53, 90, 58
Copy
Copied
XYZ
5.89, 8.37, 5.31
Copy
Copied
HSL
128°, 26%, 28%
Copy
Copied
LCH
34.74, 25.35, 145.33°
Copy
Copied
HSB
128°, 41%, 35%
Copy
Copied
LUV
34.74, -7.15, 19.17
Copy
Copied
CMYK
41%, 0%, 36%, 65%
Copy
Copied
HWB
128°, 21%, 65%
Copy
Copied

Dark Midnight Blue Color Harmonies

Analogous

Analogous colors are neighbors to Dark Midnight Blue on the color wheel, creating a harmonious and serene palette for your design projects.

#123456
#123456
#123456

Complementary

Complementary colors sit opposite Dark Midnight Blue on the color wheel. Pairing them creates a striking, high-contrast visual effect that makes both colors pop.

#123456
#123456

Split Complementary

Split complementary colors for Dark Midnight Blue use the two colors adjacent to its direct complement, creating a vibrant yet balanced and harmonious palette.

#123456
#123456
#123456

Triadic

A triadic combination for Dark Midnight Blue involves two other colors, forming an equilateral triangle on the color wheel for a bold, balanced palette.

#123456
#123456
#123456

Tetradic

Tetradic palettes pair Dark Midnight Blue with three other hues, creating a rich, four-color harmony from two sets of complementary colors.

#123456
#123456
#123456
#123456

Square

A square color scheme pairs four evenly spaced colors on the wheel. Built around Dark Midnight Blue, it creates a vibrant palette with strong contrast.

#123456
#123456
#123456
#123456

Dark Midnight Blue Color Variations

Shades

Adding black to Dark Midnight Blue creates darker shades, which introduce depth and gravity.

#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied

Tints

Tints of Dark Midnight Blue are created by adding white, resulting in softer, lighter shades.

#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied

Tones

Tones are created by mixing Dark Midnight Blue with gray for a subtler, desaturated effect.

#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied

Hues

Hues are variations of Dark Midnight Blue that differ in temperature, subtly shifting its mood.

#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied
#123456
Copy
Copied

What Interfaces Use Colors Like Dark Midnight Blue?

No items found.
Keep the inspiration going with Mobbin
Join for free
No items found.

Never run out of inspiration again.

Use Mobbin for free as long as you like or get full access with any of our paid plans.

Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Nike
Brand Logo Image
Pinterest
Logo Image
Coinbase
Wise Logo Image
Wise
Headspace Logo Image
Headspace
Airbnb Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Coinbase
Brand Logo Image
Wise
Brand Logo Image
Headspace
Brand Logo Image
Airbnb
Brand Logo Image
Uber
Brand Logo Image
Nike
Brand Logo Image
Pinterest
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Mailchimp
Brand Logo Image
Twitch
Brand Logo Image
Chatgpt
Brand Logo Image
Klarna
Brand Logo Image
Loom
Brand Logo Image
Creme
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion
Brand Logo Image
Dropbox
Brand Logo Image
Spotify
Brand Logo Image
Apple TV
Brand Logo Image
Shop
Brand Logo Image
Cosmos
Brand Logo Image
Retro
Brand Logo Image
Notion