add

Drop a brand's design tokens into your repo.

Synopsis

design-md add <slug> [flags]

Description

Fetch a brand’s DESIGN.md from the catalog and write it to your local directory. The file is complete — tokens, sections, and all — ready to pass to your AI agent or reference in your own code.

If the target file already exists, the command exits with an error. Use --force to overwrite.

Options

Flag	Default	Description
`-o, --out <path>`	`DESIGN.md`	Output file path. Relative paths resolve from current working directory.
`-f, --force`	`false`	Overwrite target file if it already exists.

Examples

Add Stripe to current directory

npx @webdesignhot/design-md add stripe

Expected output:

✓ Wrote DESIGN.md (15.2 KB · stripe)

Add to a custom filename

npx @webdesignhot/design-md add stripe --out stripe.design.md

Output:

✓ Wrote stripe.design.md (15.2 KB · stripe)

Add to a subdirectory

npx @webdesignhot/design-md add linear --out tokens/DESIGN.md

The subdirectory must exist; the command does not create it:

✓ Wrote tokens/DESIGN.md (8.9 KB · linear)

Overwrite an existing file

npx @webdesignhot/design-md add figma --force

If DESIGN.md already exists and --force is omitted, you’ll get:

✗ DESIGN.md already exists. Pass --force to overwrite.

With --force, the file is replaced without prompt:

✓ Wrote DESIGN.md (12.4 KB · figma)

Output

The command prints the target filename, file size in kilobytes, and the slug of the brand fetched. File is written as UTF-8.

If the slug does not exist in the catalog, the command exits with an error. Use list to see available brands.

If the output path already exists, the command exits with status code 1 unless --force is passed.

How to use the file

Once written, the DESIGN.md is a standalone reference:

// In a Node script or build tool
import fs from 'fs'
import yaml from 'js-yaml'

const raw = fs.readFileSync('DESIGN.md', 'utf8')
const [frontmatter] = raw.split('---').slice(1)
const tokens = yaml.load(frontmatter)

console.log(tokens.colors) // Use the colors dict in your theme

Or point your AI agent at the file directly — agents read DESIGN.md syntax natively and will use the tokens and prose context for generation:

# In Claude Code, Cursor, Cline, etc.
# Paste the DESIGN.md file path or drag it into the editor.
# The agent will read tokens and voice from the prose body.

init — scaffold a DESIGN.md for your own brand with interactive prompts
list — see all available brands in the catalog
diff — compare tokens between two brands
lint — validate a DESIGN.md against the schema

add