Theme Gallery

A clean, neutral Light and Dark default — plus six opt-in flagship themes, each a distinct personality. Click any card to apply it site-wide and watch the whole page transform.

Activelight
LightActive
Buttonbadgeaccent
> sample card content
placeholder text...

The clean, neutral default — what ships out of the box. Restrained greys, one tasteful teal accent, soft rounding, no dither.

Neutral palette, hairline borders, no dither

DarkClick to apply
Buttonbadgeaccent
> sample card content
placeholder text...

The neutral default in dark mode. Cool greys, the same teal accent — clean and quiet, no glow or scanlines.

Neutral cool-dark, hairline borders, no dither

EditorialClick to apply
Buttonbadgeaccent
> sample card content
placeholder text...

The signature flagship: warm near-black, refined teal, tasteful Bayer dither. Premium and opinionated.

Warm dark, dual-font sans/mono, committed dither

TerminalClick to apply
Buttonbadgeaccent
> sample card content
placeholder text...

Full green-on-black CRT. Every element looks like it belongs in a VT220 — scanlines and all.

Monospace everything, green phosphor, scanline overlay

BrutalClick to apply
Buttonbadgeaccent
> sample card content
placeholder text...

Loud and high-contrast: hard 2px borders, gold accent, aggressive type, offset shadows.

No border-radius, heavy borders, gold on black

PrintClick to apply
Buttonbadgeaccent
> sample card content
placeholder text...

Newsprint-inspired: halftone dot patterns on warm paper, ink-black text. Optimized for print.

Halftone dither, warm paper background, ink-black text

GrainClick to apply
Buttonbadgeaccent
> sample card content
placeholder text...

Analog film: warm cream paper, desaturated tones, a fine grain overlay. Soft and tactile.

Noise texture, warm desaturated palette, soft contrast

Mardi GrasClick to apply
Buttonbadgeaccent
> sample card content
placeholder text...

Vibrant purple, gold, and green inspired by New Orleans carnival culture.

Rich jewel tones, gold accents, festive energy

Usage

// Import a theme CSS file:
@import "@skeehn/core/themes/terminal.css";

// Or apply dynamically with a data attribute:
<html data-theme="terminal">