Back to palettes

Palette

Velvet Lounge Echo

Captures the sophisticated gloom of a late-night jazz club, filled with smoke and melancholic melodies.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Velvet Lounge Echo 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 Lounge Echo.

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

Data visualization

#2C3E50#4F6274#738797#97ACC1#BCCDDB

Palette guide

How to use Velvet Lounge Echo

Overview

The Velvet Lounge Echo palette captures the sophisticated gloom of a late-night jazz club, presenting a gradient of cool, muted blue-grays. From the deep, anchoring #2C3E50 to the progressively lighter #4F6274, #738797, and #97ACC1, it creates a sense of atmospheric depth. The lightest shade, #BCCDDB, offers a subtle, smoky highlight. This harmonious range is ideal for designers and developers aiming to evoke a melancholic, refined, and moody ambiance. It's perfect for crafting user interfaces and branding that require a sophisticated, understated elegance and a touch of nocturnal mystique.

Best used for

  • Music streaming platforms (jazz, classical)
  • Dark mode UI for productivity apps
  • Sophisticated editorial design
  • Luxury travel or hotel branding
  • Photography portfolio websites
  • High-end event promotion

Suggested color roles

primary

Use #2C3E50, the deepest blue-gray, for main backgrounds, headers, or structural elements, setting a sophisticated and calming tone.

secondary

Apply #4F6274, a darker mid-tone, suitable for navigation, card backgrounds, or secondary content blocks.

accent

Employ #BCCDDB, the lightest blue-gray, perfect for subtle highlights, interactive elements, or elegant iconography, providing gentle contrast.

background

Utilize #738797, a mid-tone blue-gray, versatile for content areas, offering a muted and refined canvas.

text

Consider #97ACC1 for secondary text or captions on darker backgrounds. For primary text, use white or near-white for optimal legibility.

Accessibility notes

  • For text on #2C3E50 and #4F6274, use white or a very light gray for optimal readability and WCAG AA compliance.
  • Ensure #BCCDDB has sufficient contrast when used for text against other light-to-mid tones; generally requiring darker text.
  • Avoid placing #97ACC1 text on #738797 backgrounds due to insufficient contrast for small text sizes.
  • Always verify contrast ratios for all text and interactive elements across the palette to ensure accessibility.

Recommended combinations

Midnight Serenade

Deep, dark base with a lighter highlight, ideal for a sophisticated, moody atmosphere in hero sections.

#2C3E50 · #4F6274 · #BCCDDB

Smoky Blues

Mid-tone focus with a soft highlight, anchored by the deepest blue-gray for structure and headings.

#738797 · #97ACC1 · #2C3E50

Lounge Gradient

A smooth transition of mid-tones for layered content, creating depth without harsh contrasts, suitable for backgrounds.

#4F6274 · #97ACC1 · #738797

CSS variables

:root {
  --velvet-lounge-echo-1: #2C3E50;
  --velvet-lounge-echo-2: #4F6274;
  --velvet-lounge-echo-3: #738797;
  --velvet-lounge-echo-4: #97ACC1;
  --velvet-lounge-echo-5: #BCCDDB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "velvet-lounge-echo": {
        1: "#2C3E50",
        2: "#4F6274",
        3: "#738797",
        4: "#97ACC1",
        5: "#BCCDDB",
      }
    }
  }
}

Related searches

moody blue gray palettesophisticated dark blue uijazz lounge colorselegant gray blue schemenocturnal ui design

Palette colors

Hex values

Color 1#2C3E50
·
Color 2#4F6274
·
Color 3#738797
·
Color 4#97ACC1
·
Color 5#BCCDDB
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
3:1Fail
4.7:1AA
6.7:1AA
2
1.7:1Fail
1.7:1Fail
2.7:1Fail
3.9:1AA18
3
3:1Fail
1.7:1Fail
1.6:1Fail
2.3:1Fail
4
4.7:1AA
2.7:1Fail
1.6:1Fail
1.4:1Fail
5
6.7:1AA
3.9:1AA18
2.3:1Fail
1.4:1Fail

Similar palettes

More like Velvet Lounge Echo

View all dark