Back to palettes

Palette

Abyssal Seaweed Garden

Enveloping dark teals and greens, reminiscent of the mysterious, shadowy kelp forests of the ocean floor.

DarkDark5 colors
More Dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Abyssal Seaweed Garden 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 Abyssal Seaweed Garden.

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

Data visualization

#0A252D#1B4751#376D79#071C22#041316

Palette guide

How to use Abyssal Seaweed Garden

Overview

The Abyssal Seaweed Garden palette offers enveloping dark teals and greens, reminiscent of the mysterious, shadowy kelp forests of the ocean floor. This dark and moody collection features rich hues like #0A252D (Dark Teal), #1B4751 (Deep Sea Green), and #376D79 (Cadet Grey), grounded by the profound #071C22 (Very Dark Teal) and #041316 (Near Black). Designers can leverage this palette to evoke a sense of quiet mystery, natural depth, and sophisticated tranquility, perfect for dark mode interfaces, eco-conscious branding, or immersive digital art. Developers will find these deep, earthy tones excellent for establishing visual hierarchy and creating distinct sections, ensuring an elegant and authoritative aesthetic that speaks to the hidden beauty of underwater ecosystems.

Best used for

  • Eco-friendly brand identity
  • Environmental conservation websites
  • Dark mode UI/UX design
  • Nature documentary visuals
  • Mysterious digital art creations
  • Underwater themed games

Suggested color roles

primary

#041316 (Near Black) - The deepest shade, ideal for main backgrounds, navigation bars, and primary content containers, providing profound depth.

secondary

#071C22 (Very Dark Teal) - A slightly lighter, yet still deep, teal for secondary panels, card backgrounds, or subtle dividing lines.

accent

#376D79 (Cadet Grey) - Use this muted blue-green for interactive elements, hover states, or to highlight key data points with a subtle glow.

background

#041316 (Near Black) - Creates an immersive, inky dark background, making any lighter elements subtly stand out.

text

White (#FFFFFF) or a very light grey (#F0F0F0) provides optimal contrast for readability against all dark colors in this palette.

Accessibility notes

  • Ensure all text, especially on the darkest backgrounds, uses white or very light grey for high contrast and readability.
  • The palette is predominantly dark; avoid using any of the darker shades for text on similar dark backgrounds.
  • When using #376D79 as an accent, ensure it has sufficient contrast against the surrounding darker teals.
  • Consider using a slightly brighter white for critical calls-to-action to ensure they are easily discoverable.

Recommended combinations

Seaweed Depth

Excellent for creating layered dark backgrounds, deep content containers, or subtle depth effects in UI design.

#041316 · #071C22 · #0A252D

Garden Glimmer

Ideal for highlighting active states, subtle calls-to-action, or creating a mysterious glow against profound darks.

#071C22 · #1B4751 · #376D79

Abyssal Contrast

Perfect for establishing clear visual hierarchy between deep background and important foreground elements.

#041316 · #0A252D · #376D79

CSS variables

:root {
  --abyssal-seaweed-garden-1: #0A252D;
  --abyssal-seaweed-garden-2: #1B4751;
  --abyssal-seaweed-garden-3: #376D79;
  --abyssal-seaweed-garden-4: #071C22;
  --abyssal-seaweed-garden-5: #041316;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "abyssal-seaweed-garden": {
        1: "#0A252D",
        2: "#1B4751",
        3: "#376D79",
        4: "#071C22",
        5: "#041316",
      }
    }
  }
}

Related searches

dark teal green paletteabyssal seaweed colorsocean floor thememysterious dark green designeco-friendly dark mode

Palette colors

Hex values

Color 1#0A252D
·
Color 2#1B4751
·
Color 3#376D79
·
Color 4#071C22
·
Color 5#041316
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.8:1Fail
1.1:1Fail
1.2:1Fail
2
1.6:1Fail
1.8:1Fail
1.7:1Fail
1.9:1Fail
3
2.8:1Fail
1.8:1Fail
3:1AA18
3.3:1AA18
4
1.1:1Fail
1.7:1Fail
3:1AA18
1.1:1Fail
5
1.2:1Fail
1.9:1Fail
3.3:1AA18
1.1:1Fail

Similar palettes

More like Abyssal Seaweed Garden

View all Dark
Abyssal Bioluminescence
Deep Forest Murmur
Oceanic Abyss Flora
Oceanic Abyss Murmur
Deep Ocean Abyss
Oceanic Trench Bloom