Back to palettes

Palette

Midnight Ink Spill

Evokes the mysterious depth of a moonlit ocean where dark inks spread slowly in the water.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Midnight Ink Spill reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Midnight Ink Spill.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#1A1A2E#283C4A#465F6B#6A8696#9BB7C7

Palette guide

How to use Midnight Ink Spill

Overview

The Midnight Ink Spill palette is a sophisticated collection of deep, cool tones perfect for projects requiring elegance and mystery. Centered around the profound #1A1A2E, it gracefully transitions through the rich #283C4A and the more subdued #465F6B, culminating in the serene #6A8696 and the airy #9BB7C7. This palette evokes the tranquil depth of a moonlit ocean, where dark inks spread slowly, offering a sense of calm and luxury. Designers and developers will find it ideal for crafting immersive user interfaces, premium branding, and content that demands a refined, understated aesthetic. Its cool, dark nature lends itself beautifully to creating a sophisticated visual experience across various digital and print mediums.

Best used for

  • Luxury brand websites and apps
  • Night mode user interfaces
  • Elegant corporate presentations
  • Sophisticated editorial designs
  • Dark theme application development
  • High-end product packaging

Suggested color roles

primary

#1A1A2E. Use this deep, mysterious tone for dominant backgrounds, large headers, or elements requiring a strong, anchoring presence. It sets the foundational mood.

secondary

#283C4A. Ideal for secondary panels, navigation bars, or card backgrounds. It provides depth and structure without competing with the primary shade.

accent

#6A8696. A muted yet distinct blue-gray, perfect for interactive elements, highlights, or subtle calls to action where a gentle pop is needed.

background

#1A1A2E. Employ this darkest shade for primary backgrounds to create a truly immersive and elegant dark theme experience.

text

#9BB7C7. This light, cool gray offers excellent readability against the darker palette colors, making it suitable for primary body text and labels.

Accessibility notes

  • Ensure sufficient contrast between #1A1A2E background and #9BB7C7 text for WCAG AA compliance.
  • Avoid using mid-tones like #465F6B or #6A8696 for small body text over dark backgrounds.
  • Test interactive elements using #6A8696 against #1A1A2E or #283C4A to confirm hover/active state visibility.
  • Provide alternative text styles (e.g., bold or larger font sizes) if using #465F6B for crucial information on darker tones.

Recommended combinations

Deep Contrast

Ideal for high-contrast text and interactive elements on a dark background, ensuring readability and subtle accentuation.

#1A1A2E · #9BB7C7 · #6A8696

Subtle Depth

Creates a layered effect for card UI elements, panels, or gradients, offering visual depth without harsh transitions.

#283C4A · #465F6B · #9BB7C7

Accentuated Focus

Use #1A1A2E as background, #6A8696 for key buttons or icons, and #283C4A for supporting text or secondary elements.

#1A1A2E · #6A8696 · #283C4A

CSS variables

:root {
  --midnight-ink-spill-5-1: #1A1A2E;
  --midnight-ink-spill-5-2: #283C4A;
  --midnight-ink-spill-5-3: #465F6B;
  --midnight-ink-spill-5-4: #6A8696;
  --midnight-ink-spill-5-5: #9BB7C7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-ink-spill-5": {
        1: "#1A1A2E",
        2: "#283C4A",
        3: "#465F6B",
        4: "#6A8696",
        5: "#9BB7C7",
      }
    }
  }
}

Related searches

dark cool color schemeelegant blue gray palettesophisticated UI colorsdeep ocean web designmidnight aesthetic branding

Palette colors

Hex values

Color 1#1A1A2E
·
Color 2#283C4A
·
Color 3#465F6B
·
Color 4#6A8696
·
Color 5#9BB7C7
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.5:1Fail
4.4:1AA18
8.1:1AAA
2
1.5:1Fail
1.7:1Fail
3:1Fail
5.4:1AA
3
2.5:1Fail
1.7:1Fail
1.8:1Fail
3.2:1AA18
4
4.4:1AA18
3:1Fail
1.8:1Fail
1.8:1Fail
5
8.1:1AAA
5.4:1AA
3.2:1AA18
1.8:1Fail

Similar palettes

More like Midnight Ink Spill

View all dark
Abyssal Trench Mystery
Dark Orchid Mystery
Deep Ocean Abyssal
Deep Sea Luminescence
Mariana Trench Enigma
Midnight Ink Spill