Palette

Midnight Library Gloom

Deep, muted tones with a hint of antique leather and aged parchment, perfect for a cozy, shadowed study.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1C1C1C#2F4F4F#696969#A0522D#B8860B

Palette guide

How to use Midnight Library Gloom

Overview

The Midnight Library Gloom palette evokes the cozy, shadowed study of an old library, blending deep, muted tones with hints of antique leather and aged parchment. Featuring the rich #1C1C1C (very dark charcoal) and #2F4F4F (dark slate gray) as foundations, it introduces warm accents like the earthy #A0522D (sienna) and the sophisticated #B8860B (dark goldenrod). This palette offers designers and developers a vintage, moody aesthetic, perfect for crafting digital experiences that feel both quiet and intriguing, with a comforting, intellectual depth.

Best used for

Vintage-themed branding and websites
Academic or literary digital platforms
Cozy blog designs or online journals
Antique shop or bookstore e-commerce
Game interfaces with a historical or mystery theme
Elegant digital storytelling projects

Suggested color roles

primary

Use #2F4F4F for main content areas or background elements, providing a deep yet inviting base.

secondary

Apply #696969 for supportive text, dividers, or secondary information, offering a neutral complement.

accent

Utilize #A0522D as a warm, rich highlight for calls-to-action or important visual cues, adding a touch of vintage charm.

background

Employ #1C1C1C as the deepest background, creating an immersive, grounding canvas for the palette's warmer tones.

text

For primary text, #B8860B or #696969 offers good legibility on darker backgrounds. For secondary text, a slightly lighter grey or white can be used.

Accessibility notes

Ensure #B8860B and #A0522D have sufficient contrast when used for text on #1C1C1C or #2F4F4F backgrounds.
Avoid using #1C1C1C and #2F4F4F as text and background pairs, as contrast will be insufficient.
The lighter gray #696969 needs careful contrast checking when used on #2F4F4F for smaller text.
Provide clear hover/active states for interactive elements, especially those using the warmer accent colors.

Recommended combinations

Vintage Foundation

A solid base with #1C1C1C as background, #2F4F4F for content panels, and #B8860B for headings or key features.

#1C1C1C · #2F4F4F · #B8860B

Aged Accents

Use #2F4F4F for main content, #696969 for supporting text, and #A0522D for elegant buttons or decorative elements.

#2F4F4F · #696969 · #A0522D

Rich Contrast

Employ #1C1C1C as a deep background, #696969 for secondary text, and #B8860B for prominent calls-to-action or titles.

#1C1C1C · #696969 · #B8860B

CSS variables

:root {
  --midnight-library-gloom-1: #1C1C1C;
  --midnight-library-gloom-2: #2F4F4F;
  --midnight-library-gloom-3: #696969;
  --midnight-library-gloom-4: #A0522D;
  --midnight-library-gloom-5: #B8860B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-library-gloom": {
        1: "#1C1C1C",
        2: "#2F4F4F",
        3: "#696969",
        4: "#A0522D",
        5: "#B8860B",
      }
    }
  }
}

Hex values

Color 1#1C1C1C

Color 2#2F4F4F

Color 3#696969

Color 4#A0522D

Color 5#B8860B

Accessibility

Contrast checker

1.9:1Fail

3.1:1AA18

3:1AA18

5.2:1AA

1.9:1Fail

1.6:1Fail

2.7:1Fail

3.1:1AA18

1.6:1Fail

1:1Fail

1.7:1Fail

3:1AA18

1.6:1Fail

1:1Fail

1.7:1Fail

5.2:1AA

2.7:1Fail

1.7:1Fail

Similar palettes

More like Midnight Library Gloom

Midnight Library Gloom

See it in context.

Ready when you are.

Built with Midnight Library Gloom.

How to use Midnight Library Gloom

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Vintage Foundation

Aged Accents

Rich Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Midnight Library Gloom