Back to palettes

Palette

Velvet Night Shadow

A sophisticated journey through deep blues and greys, like shadows falling across luxurious velvet at twilight.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Velvet Night Shadow 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 Velvet Night Shadow.

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

Data visualization

#2C3E50#34495E#4A6076#6F869A#9CAABF

Palette guide

How to use Velvet Night Shadow

Overview

The Velvet Night Shadow palette offers a sophisticated journey through deep blues and greys, perfect for designs seeking a refined and mysterious aura. Anchored by the profound #2C3E50, it transitions through supportive tones like #34495E and #4A6076, culminating in lighter, ethereal shades such as #6F869A and #9CAABF. This collection evokes the quiet elegance of twilight shadows falling across luxurious velvet, providing a versatile foundation for projects demanding a cool, professional, and understated aesthetic. Designers will find it ideal for creating depth and subtle contrast.

Best used for

  • Corporate branding with a sophisticated edge
  • Luxury product packaging and interfaces
  • UI/UX for professional applications
  • Elegant website backgrounds and hero sections
  • Editorial design for high-end publications
  • Interior design concepts for modern spaces

Suggested color roles

primary

Use #2C3E50 as the foundational deep blue-grey for main backgrounds or large graphical elements, conveying stability and depth.

secondary

Employ #34495E for supporting sections, subheadings, or darker UI components, offering a slightly softer yet equally profound tone.

accent

Apply #6F869A for subtle highlights, interactive elements, or secondary calls-to-action, providing a gentle contrast.

background

Choose #2C3E50 or #34495E for a dark, immersive background that sets a sophisticated and calm mood.

text

Utilize #9CAABF for primary body text on dark backgrounds, ensuring readability. For headings, a crisp white or near-white works effectively.

Accessibility notes

  • Ensure #9CAABF provides sufficient contrast for body text against darker palette colors like #2C3E50.
  • Avoid using #4A6076 for small text on #34495E, as contrast may be insufficient.
  • Test all critical text and background pairings with a contrast checker to meet WCAG guidelines.
  • Consider using a stark white or light grey for crucial information on the darkest shades like #2C3E50.

Recommended combinations

Deep Monochromatic

Creates a cohesive, deep, and sophisticated base for backgrounds and structural elements.

#2C3E50 · #34495E · #4A6076

Shadowed Contrast

Excellent for dark mode interfaces, offering clear readability with light text on a deep base.

#2C3E50 · #6F869A · #9CAABF

Subtle Gradient

Ideal for smooth transitions in UI elements, data visualizations, or elegant graphic overlays.

#34495E · #4A6076 · #6F869A

CSS variables

:root {
  --velvet-night-shadow-1: #2C3E50;
  --velvet-night-shadow-2: #34495E;
  --velvet-night-shadow-3: #4A6076;
  --velvet-night-shadow-4: #6F869A;
  --velvet-night-shadow-5: #9CAABF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "velvet-night-shadow": {
        1: "#2C3E50",
        2: "#34495E",
        3: "#4A6076",
        4: "#6F869A",
        5: "#9CAABF",
      }
    }
  }
}

Related searches

dark blue grey color palettecool professional brand colorssophisticated UI design palettemystery aesthetic colorselegant dark mode theme

Palette colors

Hex values

Color 1#2C3E50
·
Color 2#34495E
·
Color 3#4A6076
·
Color 4#6F869A
·
Color 5#9CAABF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.7:1Fail
2.9:1Fail
4.7:1AA
2
1.2:1Fail
1.4:1Fail
2.5:1Fail
3.9:1AA18
3
1.7:1Fail
1.4:1Fail
1.7:1Fail
2.8:1Fail
4
2.9:1Fail
2.5:1Fail
1.7:1Fail
1.6:1Fail
5
4.7:1AA
3.9:1AA18
2.8:1Fail
1.6:1Fail

Similar palettes

More like Velvet Night Shadow

View all dark
Abyssal Current Flow
Abyssal Trench Mystery
Ancient Forest Depths
Cosmic Shadow Play
Deep Forest Verdure
Deep Ocean Trench