Back to palettes

Palette

Midnight Ink Spill

A rich, mysterious blend of deep indigo and almost-black, like an elegant ink spill on ancient parchment.

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

#0F0F1A#1A1A2B#2B2B4D#3C3C6E#4D4D8F

Palette guide

How to use Midnight Ink Spill

Overview

The Midnight Ink Spill palette offers a sophisticated journey into deep blues, perfect for creating elegant and mysterious digital experiences. Anchored by the profound #0F0F1A, which serves as an almost-black foundation, it gracefully transitions through rich indigos like #1A1A2B and #2B2B4D. This collection is ideal for designers and developers aiming for a luxurious, high-contrast dark theme. The lighter shades, such as #3C3C6E and the vibrant #4D4D8F, provide excellent opportunities for accents and interactive elements, ensuring readability while maintaining the palette's overall deep, moody aesthetic. It evokes a sense of depth and professionalism, making it a versatile choice for a range of applications.

Best used for

  • Luxury brand websites and apps
  • High-tech product interfaces (e.g., software, dashboards)
  • Elegant dark mode themes
  • Creative portfolio sites
  • Nightclub or event promotion materials
  • Sophisticated editorial layouts

Suggested color roles

primary

#1A1A2B - Use as the dominant background color for content sections, providing a dark yet inviting base that's slightly less intense than pure black.

secondary

#2B2B4D - Ideal for secondary content blocks, cards, or muted navigation elements, offering a subtle visual break from the primary background.

accent

#4D4D8F - Reserve this vibrant blue for interactive elements like buttons, links, progress bars, or key data visualizations to draw attention effectively.

background

#0F0F1A - The deepest shade, perfect for the main page background, headers, or footers, creating a truly immersive and profound dark canvas.

text

For optimal readability, use a bright white or very light off-white text color (e.g., #FFFFFF or #F0F0F0) against all shades in this dark palette.

Accessibility notes

  • Ensure sufficient contrast (AA or AAA) for text against all dark backgrounds; light text like #FFFFFF is crucial.
  • Avoid using mid-tone blues like #2B2B4D or #3C3C6E for small body text on darker blues like #0F0F1A without checking contrast ratios.
  • Use the lightest color, #4D4D8F, sparingly for essential UI elements or larger text to maximize visibility.
  • Provide clear visual focus indicators for interactive elements, as subtle color changes might be hard to perceive within this dark palette.

Recommended combinations

Deep Contrast

Excellent for main backgrounds (#0F0F1A) with primary accents (#4D4D8F) and secondary content containers (#1A1A2B), ensuring strong visual hierarchy.

#0F0F1A · #4D4D8F · #1A1A2B

Subtle Depth

Ideal for layered dark interfaces where subtle shifts in tone define different content areas or UI components, like nested cards or modals.

#1A1A2B · #2B2B4D · #3C3C6E

Accentuated Focus

Use #0F0F1A as a base, with #3C3C6E for highlighted sections, and #4D4D8F for active states or critical calls to action to guide user attention.

#0F0F1A · #3C3C6E · #4D4D8F

CSS variables

:root {
  --midnight-ink-spill-1: #0F0F1A;
  --midnight-ink-spill-2: #1A1A2B;
  --midnight-ink-spill-3: #2B2B4D;
  --midnight-ink-spill-4: #3C3C6E;
  --midnight-ink-spill-5: #4D4D8F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-ink-spill": {
        1: "#0F0F1A",
        2: "#1A1A2B",
        3: "#2B2B4D",
        4: "#3C3C6E",
        5: "#4D4D8F",
      }
    }
  }
}

Related searches

dark blue color schemessophisticated UI palettedeep indigo design colorselegant dark mode hex codesluxury brand color palette

Palette colors

Hex values

Color 1#0F0F1A
·
Color 2#1A1A2B
·
Color 3#2B2B4D
·
Color 4#3C3C6E
·
Color 5#4D4D8F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.4:1Fail
1.9:1Fail
2.5:1Fail
2
1.1:1Fail
1.3:1Fail
1.7:1Fail
2.3:1Fail
3
1.4:1Fail
1.3:1Fail
1.3:1Fail
1.8:1Fail
4
1.9:1Fail
1.7:1Fail
1.3:1Fail
1.3:1Fail
5
2.5:1Fail
2.3:1Fail
1.8:1Fail
1.3:1Fail

Similar palettes

More like Midnight Ink Spill

View all dark