Palette

Midnight Forest Velvet

A deep and brooding palette capturing the mystery and serene calm of a forest under a moonless night.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Midnight Forest Velvet 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 Forest Velvet.

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

Data visualization

#0F1F27#2A3F4A#4B5E6B#7A8D9B#050F15

Palette guide

How to use Midnight Forest Velvet

Overview

The Midnight Forest Velvet palette is a deep and brooding collection of blues and grays, evoking the serene calm and mystery of a moonless forest night. Comprising #0F1F27, #2A3F4A, #4B5E6B, #7A8D9B, and #050F15, this palette exudes sophistication and elegance. Its velvety tones are ideal for creating an immersive, luxurious, and tranquil atmosphere. Designers can leverage these colors for projects requiring a sense of depth, professionalism, and understated luxury, making it perfect for high-end digital experiences or refined brand identities.

Best used for

Luxury branding and high-end services
Corporate and tech company websites
Elegant app and software interfaces
Evening wear and fashion design
Artistic and photographic portfolios
Abstract and moody digital art

Suggested color roles

primary

Designate #050F15 as the deepest foundational navy for extensive backgrounds, headers, or primary visual anchors, providing profound depth.

secondary

Use #0F1F27 for supporting panels, card backgrounds, or secondary navigation, offering a rich yet subtle contrast.

accent

Apply #4B5E6B for subtle interactive elements, icons, or borders, providing a muted accent within the dark scheme.

background

Utilize #050F15 or #0F1F27 for immersive dark backgrounds that exude luxury and sophistication.

text

For optimal readability on these deep tones, use pure white or a very light gray. For subtle secondary text, #7A8D9B can be used on darker shades.

Accessibility notes

Ensure white or light gray text has strong contrast on #050F15, #0F1F27, and #2A3F4A.
Avoid using #4B5E6B for small text on #2A3F4A due to potential low contrast.
Use #7A8D9B primarily for larger headings or subtle graphic elements, as its contrast on darks may be moderate.
Test color combinations on various displays to ensure legibility and desired mood.

Recommended combinations

Deep Twilight

Creates a profound, foundational blue-gray theme, excellent for deep backgrounds and structural components.

#050F15 · #0F1F27 · #2A3F4A

Velvet Mist

Offers a lighter, atmospheric blend of blues, ideal for content areas or subtle gradient effects.

#2A3F4A · #4B5E6B · #7A8D9B

Night Sky

Provides high contrast with elegant blue tones, suitable for primary content on dark backgrounds with subtle accents.

#050F15 · #7A8D9B · #4B5E6B

CSS variables

:root {
  --midnight-forest-velvet-1: #0F1F27;
  --midnight-forest-velvet-2: #2A3F4A;
  --midnight-forest-velvet-3: #4B5E6B;
  --midnight-forest-velvet-4: #7A8D9B;
  --midnight-forest-velvet-5: #050F15;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-forest-velvet": {
        1: "#0F1F27",
        2: "#2A3F4A",
        3: "#4B5E6B",
        4: "#7A8D9B",
        5: "#050F15",
      }
    }
  }
}

Hex values

Color 1#0F1F27

Color 2#2A3F4A

Color 3#4B5E6B

Color 4#7A8D9B

Color 5#050F15

Accessibility

Contrast checker

1.5:1Fail

2.5:1Fail

4.9:1AA

1.1:1Fail

1.5:1Fail

1.6:1Fail

3.2:1AA18

1.8:1Fail

2.5:1Fail

1.6:1Fail

2:1Fail

2.9:1Fail

4.9:1AA

3.2:1AA18

2:1Fail

5.6:1AA

1.1:1Fail

1.8:1Fail

2.9:1Fail

5.6:1AA

Similar palettes

More like Midnight Forest Velvet

View all dark

Enchanted Forest Night

Midnight Forest

Shadowed Woods Twilight

Starlit Canvas

Abyss Gaze

Abyssal Bioluminescence