Palette

Bayou Witch Gloom

A shadowy journey into a mystical bayou, where dark waters meet eerie, moonlit foliage.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Bayou Witch 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 Bayou Witch Gloom.

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

Data visualization

#36454F#2F4F4F#4B0082#6B8E23#000000

Palette guide

How to use Bayou Witch Gloom

Overview

The Bayou Witch Gloom palette offers a shadowy journey into a mystical bayou, where dark waters meet eerie, moonlit foliage. Featuring pure black #000000, dark charcoal blue #36454F, and deep indigo #4B0082, this collection is perfect for designers and developers seeking a mysterious, dark, and gloomy aesthetic. The additional shades of dark slate grey #2F4F4F and muted olive green #6B8E23 complete a spectrum that creates profound depth and a sense of eerie intrigue. This palette is ideal for projects that require a dramatic, atmospheric presence, emphasizing shadows, mystery, and a touch of the supernatural.

Best used for

Horror game interfaces or branding
Mystical and fantasy-themed websites and digital art
Dark, atmospheric digital art and illustrations
Branding for escape rooms or mystery events
Gothic-inspired fashion editorials and marketing
Themed restaurant interiors or immersive experiences

Suggested color roles

primary

Utilize pure black #000000 for deepest shadows, dominant backgrounds, or powerful statements, providing ultimate depth.

secondary

Apply the dark charcoal blue #36454F for main content panels, headers, or significant textual blocks, offering strong readability.

accent

Employ deep indigo #4B0082 and muted olive green #6B8E23 for eerie highlights, interactive elements, or striking details, drawing attention.

background

Use the dark slate grey #2F4F4F for a somber, mysterious base, or #000000 for a profoundly dark and immersive theme.

text

Integrate white or light grey for optimal readability on dark backgrounds, or use #000000 for strong text on light backgrounds.

Accessibility notes

Pure black #000000 provides excellent contrast for white or very light grey text, ensuring optimal readability.
Deep indigo #4B0082 and muted olive green #6B8E23 offer good contrast on #000000 or dark slate grey #2F4F4F.
Be cautious when using dark charcoal blue #36454F or dark slate grey #2F4F4F for text on similar dark backgrounds; check WCAG contrast.
Ensure sufficient contrast for all interactive elements, especially on dark themes, to maintain usability.

Recommended combinations

Eerie Depth

Create a profound and mysterious dark aesthetic for backgrounds and primary content areas, ideal for high-impact visual statements.

#000000 · #2F4F4F · #36454F

Mystical Glow

Introduce striking, almost supernatural accents against a deep, dark base, perfect for calls-to-action or significant visual elements.

#000000 · #4B0082 · #6B8E23

Gloomy Contrast

Design a subtle, yet dark, interplay of colors for sections requiring a sophisticated visual flow or background texture.

#36454F · #6B8E23 · #2F4F4F

CSS variables

:root {
  --bayou-witch-gloom-1: #36454F;
  --bayou-witch-gloom-2: #2F4F4F;
  --bayou-witch-gloom-3: #4B0082;
  --bayou-witch-gloom-4: #6B8E23;
  --bayou-witch-gloom-5: #000000;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "bayou-witch-gloom": {
        1: "#36454F",
        2: "#2F4F4F",
        3: "#4B0082",
        4: "#6B8E23",
        5: "#000000",
      }
    }
  }
}

Hex values

Color 1#36454F

Color 2#2F4F4F

Color 3#4B0082

Color 4#6B8E23

Color 5#000000

Accessibility

Contrast checker

1.1:1Fail

1.3:1Fail

2.6:1Fail

2.1:1Fail

1.1:1Fail

1.5:1Fail

2.3:1Fail

2.4:1Fail

1.3:1Fail

1.5:1Fail

3.4:1AA18

1.6:1Fail

2.6:1Fail

2.3:1Fail

3.4:1AA18

5.5:1AA

2.1:1Fail

2.4:1Fail

1.6:1Fail

5.5:1AA

Similar palettes

More like Bayou Witch Gloom

Deep Undergrowth Shadow

Enchanted Forest Veil