Back to palettes

Palette

Obsidian Flow Edge

Captures the sharp, glossy darkness and cool greys of freshly cooled obsidian lava at its edge.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Obsidian Flow Edge 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 Obsidian Flow Edge.

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

Data visualization

#0A0A0A#1A1A1A#2F4F4F#4D4D4D#708090

Palette guide

How to use Obsidian Flow Edge

Overview

The Obsidian Flow Edge palette beautifully captures the cool, sharp elegance of freshly cooled obsidian lava, focusing on deep blacks and sophisticated cool greys. It ranges from the profound #0A0A0A and #1A1A1A, through the distinctive cool grey-green #2F4F4F, to the balanced #4D4D4D and the lighter, almost slate #708090. This palette is perfect for designers aiming to create a modern, minimalist, and serene yet powerful aesthetic. Developers will find these shades ideal for dark mode interfaces, technical documentation, or any application requiring a clean, professional look with subtle depth and texture. The cool undertones evoke a sense of calm and precision, enhancing user experience.

Best used for

  • Modern tech company websites
  • Minimalist portfolio sites
  • Data visualization dashboards
  • Luxury product presentations
  • Architectural firm branding
  • Dark theme mobile applications

Suggested color roles

primary

#0A0A0A - The dominant dark base, providing a sleek, deep background for a sophisticated and modern feel.

secondary

#1A1A1A - Excellent for secondary backgrounds, card elements, or subtle dividers, adding depth without visual clutter.

accent

#2F4F4F - A cool, deep accent color, perfect for interactive elements, subtle highlights, or brand elements that need a unique touch.

background

#0A0A0A - Creates a clean, uncluttered canvas, allowing content to stand out with understated elegance.

text

#708090 - Ideal for body text on darker backgrounds, offering good readability with a soft, cool tone. Use pure white for higher contrast.

Accessibility notes

  • Ensure #708090 text has sufficient contrast against #0A0A0A, #1A1A1A, and #2F4F4F for WCAG AA compliance.
  • Avoid using #4D4D4D on #2F4F4F for critical text due to potentially low contrast.
  • For primary headings or important information, consider using a pure white text on the darkest shades.
  • Check contrast ratios for all text-on-background pairings, especially with the darker greys.

Recommended combinations

Cool Depth

Creates a sophisticated, layered dark interface with a cool accent and legible text, suitable for hero sections.

#0A0A0A · #2F4F4F · #708090

Monochromatic Flow

Ideal for content blocks or multi-level navigation, providing subtle visual hierarchy through shades of grey.

#1A1A1A · #4D4D4D · #708090

Edge Highlight

Useful for highlighting specific elements within a mid-grey area, using the cool accent as a subtle differentiator.

#4D4D4D · #2F4F4F · #0A0A0A

CSS variables

:root {
  --obsidian-flow-edge-1: #0A0A0A;
  --obsidian-flow-edge-2: #1A1A1A;
  --obsidian-flow-edge-3: #2F4F4F;
  --obsidian-flow-edge-4: #4D4D4D;
  --obsidian-flow-edge-5: #708090;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "obsidian-flow-edge": {
        1: "#0A0A0A",
        2: "#1A1A1A",
        3: "#2F4F4F",
        4: "#4D4D4D",
        5: "#708090",
      }
    }
  }
}

Related searches

cool grey black paletteobsidian minimal designdark mode aestheticslate grey color schememodern volcanic colors

Palette colors

Hex values

Color 1#0A0A0A
·
Color 2#1A1A1A
·
Color 3#2F4F4F
·
Color 4#4D4D4D
·
Color 5#708090
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
2.2:1Fail
2.3:1Fail
4.9:1AA
2
1.1:1Fail
1.9:1Fail
2.1:1Fail
4.3:1AA18
3
2.2:1Fail
1.9:1Fail
1.1:1Fail
2.2:1Fail
4
2.3:1Fail
2.1:1Fail
1.1:1Fail
2.1:1Fail
5
4.9:1AA
4.3:1AA18
2.2:1Fail
2.1:1Fail

Similar palettes

More like Obsidian Flow Edge

View all dark