Back to palettes

Palette

Midnight Library Tome

Deep, somber greys paired with hints of aged crimson, evoking the quiet elegance of an old library.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Midnight Library Tome 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 Library Tome.

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

Data visualization

#2F2F2F#4A4A4A#6F6F6F#8B0000#5C0000

Palette guide

How to use Midnight Library Tome

Overview

The Midnight Library Tome palette embodies the quiet elegance and gothic allure of an ancient library. It combines deep, somber grays like #2F2F2F and #4A4A4A with powerful hints of aged crimson, specifically #8B0000 (dark red) and #5C0000 (deeper red). This palette is crafted for designers and developers aiming to create a dramatic yet sophisticated aesthetic, reminiscent of antique books and hushed, shadowed corners. It's ideal for projects that require a touch of historical grandeur, mystery, and a strong visual presence.

Best used for

  • Gothic literature or fantasy game themes
  • Luxury branding with a classic edge
  • Historical documentary interfaces
  • Sophisticated art and design portfolios
  • Dramatic web design projects
  • Event branding for upscale, mysterious gatherings

Suggested color roles

primary

Use #2F2F2F as the main background or for dominant content areas, providing a deep, anchoring presence.

secondary

Apply #4A4A4A for content panels, secondary information, or subtle dividers, creating visual structure.

accent

Utilize #8B0000 as a bold, elegant highlight for calls-to-action, important links, or dramatic visual elements.

background

Employ #2F2F2F as the foundational background, offering an immersive and profound dark canvas.

text

For primary text, #6F6F6F provides good readability on darker backgrounds. For secondary text, a light gray or white can be used, ensuring strong contrast.

Accessibility notes

  • Ensure #6F6F6F has sufficient contrast when used for text on #2F2F2F or #4A4A4A backgrounds.
  • The deep reds, #8B0000 and #5C0000, will require a very light text color (e.g., white) to ensure readability if used for text.
  • Avoid using #2F2F2F and #4A4A4A as text and background pairs due to insufficient contrast.
  • Maintain clear visual cues for interactive elements, making sure they stand out against the dark, muted tones.

Recommended combinations

Gothic Foundation

A layered dark theme with #2F2F2F as background, #4A4A4A for content cards, and #6F6F6F for primary text or subtle headings.

#2F2F2F · #4A4A4A · #6F6F6F

Dramatic Accent

Use #2F2F2F as background, #8B0000 for prominent calls-to-action, and #5C0000 for secondary buttons or decorative elements.

#2F2F2F · #8B0000 · #5C0000

Elegant Read

Employ #4A4A4A for main content areas, #6F6F6F for body text, and #8B0000 for important links or hover states.

#4A4A4A · #6F6F6F · #8B0000

CSS variables

:root {
  --midnight-library-tome-1: #2F2F2F;
  --midnight-library-tome-2: #4A4A4A;
  --midnight-library-tome-3: #6F6F6F;
  --midnight-library-tome-4: #8B0000;
  --midnight-library-tome-5: #5C0000;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-library-tome": {
        1: "#2F2F2F",
        2: "#4A4A4A",
        3: "#6F6F6F",
        4: "#8B0000",
        5: "#5C0000",
      }
    }
  }
}

Related searches

gothic color palettedark red grey schemeancient library colorselegant dark themedramatic UI colors

Palette colors

Hex values

Color 1#2F2F2F
·
Color 2#4A4A4A
·
Color 3#6F6F6F
·
Color 4#8B0000
·
Color 5#5C0000
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.7:1Fail
1.3:1Fail
1.1:1Fail
2
1.5:1Fail
1.8:1Fail
1.1:1Fail
1.6:1Fail
3
2.7:1Fail
1.8:1Fail
2:1Fail
2.9:1Fail
4
1.3:1Fail
1.1:1Fail
2:1Fail
1.4:1Fail
5
1.1:1Fail
1.6:1Fail
2.9:1Fail
1.4:1Fail

Similar palettes

More like Midnight Library Tome

View all dark