Back to palettes

Palette

Hematite Vein

Inspired by the metallic luster and subtle dark tones of hematite mineral veins within rock formations.

darkminimal5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Hematite Vein 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 Hematite Vein.

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

Data visualization

#3A3E40#5E6366#8F9599#C1C6C9#2E3032

Palette guide

How to use Hematite Vein

Overview

The Hematite Vein palette draws inspiration from the metallic luster and subtle dark tones of hematite mineral veins, offering a sophisticated range of deep and muted grays. With grounding charcoals like #2E3032 and #3A3E40, complemented by the mid-tone #5E6366 and the lighter, metallic #8F9599, this palette is ideal for designers and developers seeking a strong, modern, and minimalist aesthetic. The soft #C1C6C9 provides a clean, balancing element. This collection ensures a professional, understated, and highly versatile foundation for digital experiences or branding that conveys strength, precision, and contemporary elegance.

Best used for

  • Tech startup interfaces and corporate websites
  • Industrial design and engineering branding
  • Luxury automotive and high-tech product marketing
  • Professional services and consulting firm identities
  • Modern minimalist interior design concepts
  • Digital content demanding a sleek and serious tone

Suggested color roles

primary

Utilize #3A3E40 as a deep, grounding primary color for main content areas, navigation, or strong brand elements, conveying authority.

secondary

The mid-tone #5E6366 serves as a subtle secondary color for subheadings, active states, or background accents, adding a touch of softness.

accent

Apply #8F9599 as a lighter, metallic accent for icons, dividers, or subtle highlights, providing a refined contrast.

background

The soft, light #C1C6C9 provides an excellent, clean background, ensuring high readability for darker text and a modern canvas.

text

Employ #2E3032 for body text and crucial information. This deepest charcoal ensures superior contrast and readability on lighter palette colors.

Accessibility notes

  • Ensure #2E3032 provides excellent contrast against #C1C6C9 for all critical text to meet WCAG AA standards.
  • Avoid using #8F9599 for small text on #C1C6C9 due to insufficient contrast; best for larger elements or as a background for dark text.
  • When using darker grays like #3A3E40 as backgrounds, ensure text is in #C1C6C9 or a very light shade for legibility.
  • The mid-tone #5E6366 works well for text on #C1C6C9, but always verify contrast for readability, especially with smaller fonts.

Recommended combinations

Mineral Depth

Perfect for strong headers or footers, conveying a sense of depth and robust stability.

#2E3032 · #3A3E40 · #5E6366

Metallic Sheen

Ideal for clean layouts or interactive elements, mimicking the subtle sheen of metal.

#C1C6C9 · #8F9599 · #5E6366

Subtle Strength

Suitable for feature cards or content blocks, balancing dark grounding tones with a light, readable background.

#3A3E40 · #C1C6C9 · #2E3032

CSS variables

:root {
  --hematite-vein-1: #3A3E40;
  --hematite-vein-2: #5E6366;
  --hematite-vein-3: #8F9599;
  --hematite-vein-4: #C1C6C9;
  --hematite-vein-5: #2E3032;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "hematite-vein": {
        1: "#3A3E40",
        2: "#5E6366",
        3: "#8F9599",
        4: "#C1C6C9",
        5: "#2E3032",
      }
    }
  }
}

Related searches

dark gray palettemetallic mineral colorssubtle industrial designmodern charcoal huesminimalist tech interface

Palette colors

Hex values

Color 1#3A3E40
·
Color 2#5E6366
·
Color 3#8F9599
·
Color 4#C1C6C9
·
Color 5#2E3032
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
3.6:1AA18
6.3:1AA
1.2:1Fail
2
1.8:1Fail
2:1Fail
3.5:1AA18
2.2:1Fail
3
3.6:1AA18
2:1Fail
1.8:1Fail
4.4:1AA18
4
6.3:1AA
3.5:1AA18
1.8:1Fail
7.7:1AAA
5
1.2:1Fail
2.2:1Fail
4.4:1AA18
7.7:1AAA

Similar palettes

More like Hematite Vein

View all dark