Obsidian

Obsidian is Stratum’s editorial theme. Inspired by Gumroad’s product, it uses hard edges, bold type, thick borders, and square corners to create a sense of structural confidence and directness.

Character

Trait	Value
Inspiration	Gumroad
Button shape	Default (radius.md)
Icon weight	Bold
Border radius (md)	0
Border width (thin)	2
Accent	Electric yellow

When to use Obsidian

Obsidian works for creator tools, content platforms, developer tools, and any product that wants to feel raw, confident, and direct. The zero-radius treatment and thick borders give every element a deliberate, architectural quality.

Light vs dark

The dark variant is particularly striking — near-black backgrounds with high-contrast text and bright accents. The bold icon weight remains consistent across both modes.

Files

src/tokens/themes/obsidian.ts

Exports: obsidianThemeLight, obsidianThemeDark

Using Obsidian as a base for custom themes

import { createTheme } from '@/tokens/themes/createTheme';
import { obsidianThemeLight, obsidianThemeDark } from '@/tokens/themes/obsidian';

export const brandLight = createTheme(obsidianThemeLight, {
  colors: {
    accent:       '#7C3AED',
    accentHover:  '#6D28D9',
    accentSubtle: '#EDE9FE',
  },
});

Related

• Slate — clean, high-contrast default theme
• Quartz — expressive, translucent theme
• Custom Themes — extending any built-in theme
• Theme Registry — registering themes