visual-explainer · style catalog

Pick a style, then generate.

Every value --style accepts, as a specimen — each card shows the palette committed to real hex values, the font pairing, and the flag to copy. The other two tabs hold the commands to spend a style on and the output formats. Hand a name back to the agent, or paste the flag onto any command.

Design directions

Constrained by intent, not just color — each one carries layout and typography requirements that crowd out generic output. Prefer these.

dark · Fira Code

Blueprint

Sample body text set in DM Sans. The palette below is the specimen, not the page.

gateway --bind 0.0.0.0:8080

Technical drawing — subtle grid, precise borders, monospace labels.

  • canvas#0f172a
  • card#1a2438
  • primary#38bdf8
  • secondary#5eead4
  • signal#fbbf24

DM Sans / Fira Code

--style blueprint

light · Noto Sans Mono

Editorial

Sample body text set in Crimson Pro. The palette below is the specimen, not the page.

retries: 2  duration=142ms

Serif headlines, generous whitespace, deep navy and gold.

  • stock#fbfaf8
  • ink#141b2d
  • navy#1e3a5f
  • gold#a67c2e
  • claret#7d2b3d

Crimson Pro / Noto Sans Mono

--style editorial

light · Source Code Pro

Paper

Sample body text set in Fraunces. The palette below is the specimen, not the page.

retries: 2  duration=142ms

Warm cream stock, terracotta and sage, informal.

  • cream#faf7f5
  • terracotta#c2643c
  • sage#6b8e5a
  • ochre#b08430
  • rule#e8e0d9

Fraunces / Source Code Pro

--style paper

dark · Space Mono

Terminal

Sample body text set in Space Mono. The palette below is the specimen, not the page.

retries: 2  duration=142ms

Monochrome — green or amber on near-black, monospace everything.

  • void#080a08
  • phosphor#c8facc
  • green#37d67a
  • amber#ffb454
  • alert#e05252

Space Mono / Space Mono

--style terminal

light · Inconsolata

Data-dense

Sample body text set in Libre Franklin. The palette below is the specimen, not the page.

routep95err
/v1/ingest142ms0.02%
/v1/query318ms1.40%
/v1/health4ms0.00%

Small type, tight spacing, maximum information, muted colors.

  • canvas#f7f7f8
  • gridline#dcdee1
  • steel#2f6f8f
  • moss#4a7a5c
  • rust#9a5b28

Libre Franklin / Inconsolata

--style data-dense

Editor schemes

A real editor scheme, committed to exactly. These fix the palette only — you still choose a font pairing and a layout on top of one.

dark

Dracula

const limit = 42;
--style dracula

dark

Nord

const limit = 42;
--style nord

dark

Catppuccin Mocha

const limit = 42;
--style catppuccin-mocha

light

Catppuccin Latte

const limit = 42;
--style catppuccin-latte

dark

Solarized Dark

const limit = 42;
--style solarized-dark

light

Solarized Light

const limit = 42;
--style solarized-light

dark

Gruvbox

const limit = 42;
--style gruvbox

dark

One Dark

const limit = 42;
--style one-dark

dark

Rosé Pine

const limit = 42;
--style rose-pine

Composing

Override a single axis without leaving a style: --palette terracotta+sage, --font fraunces+source-code-pro, --theme dark.

Two values are rejected outright: neon and gradient-mesh. They always produce generic output.