init
Interactive picker — fuzzy-search the catalog, preview, install.
Synopsis
design-md init
What it does
init launches an interactive picker in your terminal. You get a fuzzy-searchable list of all brands in the catalog, with tags and featured status visible inline. Arrow keys to navigate, type to filter, Enter to pick. Once selected, you’ll be prompted for an output filename (defaults to DESIGN.md), and if the file exists, you’ll confirm the overwrite. The command then fetches the full DESIGN.md for that brand and writes it to disk.
Featured brands appear with a ★ prefix. Tags are sliced to four per entry so the prompt stays readable at any terminal width.
Options
init takes no flags. The interactive flow handles all decisions — brand selection and filename — via prompts.
Examples
Launch the picker
npx @webdesignhot/design-md init
You’ll see:
✓ design-md init
Fetching catalog…
286 designs available
Pick a design (type to search):
┌ ★ Stripe infrastructure · fintech · clean · prominent
│ ★ Linear product · saas · clean · professional
│ Notion workspace · wiki · minimalist · playful
│ Anthropic ai · neutral · technical · accessible
│ OpenAI ai · orange · minimalist · bold
│ Vercel devtools · minimalist · forward · modern
│ Apple ecosystem · universal · premium · accessible
│ Airbnb travel · playful · inclusive · global
│ Plaid fintech · blue · accessible · trust
│ Grafana observability · dark · technical · depth
└
Use arrow keys to navigate, or type to filter (e.g., type “linear” to jump to Linear). Press Enter to select.
Select a brand and confirm the filename
Once you press Enter on a brand:
Write to (press enter for default):
❯ DESIGN.md
You can change the filename or press Enter to accept the default. If DESIGN.md already exists in your directory, you’ll be asked to confirm the overwrite:
DESIGN.md exists — overwrite?
❯ (y/n)
Installation completes
Once confirmed, the full DESIGN.md fetches and writes:
✓ Wrote DESIGN.md (15.2 KB)
✓ stripe installed. Point your AI agent at DESIGN.md and you are done.
The file is ready to use immediately.
When to use init vs add
Use init when you want to browse and explore. You haven’t decided which brand yet, or you want to see the list and pick interactively.
Use add when you already know the slug. For example, if a teammate says “use linear,” you can run npx @webdesignhot/design-md add linear --out DESIGN.md without launching the picker.
init also works well for discovery — run it in a new project to see what’s available before committing to a brand.