Skip to content

CLI Commands

brand init New

Generate a brand system from brand guidelines.

sh
nib brand init [OPTIONS]
FlagTypeDefaultDescription
--fromstringSource: path to .md/.txt/.pdf file, or a URL
--aistringanthropicAI provider: anthropic, openai, ollama
--outputstringdocs/design/systemOutput directory
--no-aibooleanfalseSkip AI enhancement

Examples:

sh
# Interactive guided flow
nib brand init

# From a markdown file
nib brand init --from brand-guidelines.md

# From a website
nib brand init --from https://acme.com

# From a PDF, no AI
nib brand init --from brand.pdf --no-ai

# Custom output directory
nib brand init --from brand.md -o src/design-system

brand build New

Build platform outputs (CSS, Tailwind, Pencil) from DTCG token files.

sh
nib brand build [OPTIONS]
FlagTypeDefaultDescription
--configstring.nib/brand.config.jsonPath to brand config

Examples:

sh
# Rebuild all platform outputs
nib brand build

# Use a custom config
nib brand build --config path/to/brand.config.json

brand push New

Sync design tokens into a Pencil .pen file. Also includes Pencil $-- standard variable mappings ($--background, $--primary, $--foreground, etc.) so Pencil style guides work with your brand out of the box.

If the target file doesn't exist yet, nib creates it and opens it in Pencil automatically — this is the recommended first-time setup path.

sh
nib brand push [file] [OPTIONS]
FlagTypeDefaultDescription
--configstring.nib/brand.config.jsonPath to brand config

Pencil open required

Pencil.app must be running. The file path is read from brand.config.json → platforms.penFile (default: docs/design/system/design-system.pen).

First-time setup:

sh
nib brand push
# → Creates docs/design/system/design-system.pen
# → Opens it in Pencil with tokens loaded
# → Save it in Pencil (Cmd+S) to persist

Subsequent pushes:

sh
nib brand push               # uses penFile from brand.config.json
nib brand push my-design.pen # explicit path

brand style New

Fetch a Pencil style guide and push it (with $-- standard variable mappings) to a .pen file.

sh
nib brand style [OPTIONS]
FlagTypeDefaultDescription
--tagsstringComma-separated style guide tags (e.g., minimal,webapp)
--namestringFetch a specific style guide by name
--filestringfrom configPath to .pen file
--configstring.nib/brand.config.jsonPath to brand config

When called with no flags, lists the available style guide tags. When --tags or --name is provided, fetches the matching style guide and pushes all variables (including $-- standard mappings) to the .pen file.

MCP Required

This command needs a running Pencil.dev instance with its MCP server accessible.

Examples:

sh
# List available style guide tags
nib brand style

# Fetch a style guide by tags
nib brand style --tags minimal,webapp,developer

# Fetch a specific style guide by name
nib brand style --name "Modern Dashboard"

# Target a specific .pen file
nib brand style --tags minimal --file my-design.pen

brand audit New

Check WCAG contrast compliance of all semantic color token pairs.

sh
nib brand audit [OPTIONS]
FlagTypeDefaultDescription
--configstring.nib/brand.config.jsonPath to brand config
--levelstringAAMinimum level: AA or AAA

Exits with code 1 if any pair fails — suitable for CI pipelines.

Examples:

sh
# Run audit
nib brand audit

# Require AAA compliance
nib brand audit --level AAA

brand import New

Import variables from an existing Pencil .pen file into DTCG token files and brand.config.json. Use this when your design system already lives in Pencil and you want to bring it under nib control.

sh
nib brand import <file> [OPTIONS]
FlagTypeDefaultDescription
--outputstringdocs/design/system/tokensTokens output directory
--configstring.nib/brand.config.jsonPath to write brand config

If brand.config.json already exists, nib shows a diff and asks before overwriting.

Pencil open required

Pencil.app must be running with the target .pen file open.

Examples:

sh
# Import from an existing design file
nib brand import docs/design/system/design-system.pen

# Custom output locations
nib brand import design.pen --output src/tokens --config src/.brand.json

kit New

Bootstrap a complete design system (tokens + base component kit + Pencil-ready outputs), or return a scaffolding recipe for Claude to draw component frames in Pencil.

sh
# Full bootstrap (interactive)
nib kit

# Bootstrap from a brand brief file
nib kit --from brand.md --no-ai

# Get a Pencil scaffolding recipe
nib kit --recipe [--component Button,Dialog] [--json]
FlagTypeDefaultDescription
--fromstringBrand brief: .md/.txt/.pdf file or URL
--no-aibooleanfalseSkip AI enhancement
--skip-initbooleanfalseUse existing brand.config.json
--recipebooleanfalseReturn a Pencil scaffolding recipe instead of bootstrapping
--componentstringallWith --recipe: comma-separated component names
--jsonbooleanfalseWith --recipe: output as JSON envelope

pencil open New

Open a .pen file in Pencil from the terminal. Pass new to create a blank canvas.

sh
nib pencil open <file|new>

Pencil must already be running

This command tells the running Pencil.app to open a file — it does not launch Pencil. Open Pencil.app first, then run this command.

Examples:

sh
# Open an existing file
nib pencil open docs/design/system/design-system.pen

# Create a blank canvas
nib pencil open new

After nib pencil open new, save the file in Pencil (Cmd+S) to a path of your choice, then run nib brand push --file <that-path> to push your tokens into it.

pencil status New

Check whether Pencil.app is running and the MCP server is responding.

sh
nib pencil status

Returns one of three states:

  • Pencil running — binary found, get_editor_state responded
  • Pencil found but not running — binary exists, no response (open Pencil.app)
  • Pencil not installed — binary not found at any known path

prototype Prototypes

Full pipeline: .pen → HTML prototype (MCP → capture → build).

sh
nib prototype <files...>
FlagAliasTypeDefaultDescription
--output-ostring./prototypeOutput directory
--template-tstringcleanTemplate: clean, presentation
--standalonebooleanfalseEmbed all assets for offline use
--device-dstringDevice frame name
--configstringPath to nib.config.json

MCP Required

This command needs a running Pencil.dev instance with its MCP server accessible.

Examples:

sh
# Build a prototype from a single file
nib prototype my-design.pen

# Build with a device frame and presentation template
nib prototype app.pen -t presentation -d "iPhone 16 Pro"

# Standalone single-file output
nib prototype app.pen --standalone -o dist/

capture Prototypes

Extract a .pen file into intermediate JSON.

sh
nib capture <file>
FlagAliasTypeDefaultDescription
--output-ostring<filename>.design.jsonOutput path for the JSON file
--canvases-cstringallComma-separated canvas names to capture

MCP Required

This command needs a running Pencil.dev instance with its MCP server accessible.

Examples:

sh
# Capture all canvases
nib capture my-design.pen

# Capture specific canvases
nib capture my-design.pen -c "Home,Settings"

# Custom output path
nib capture my-design.pen -o snapshots/design.json

build Prototypes

Build an HTML prototype from a .design.json snapshot. Fully offline — no Pencil, no MCP, no network required.

sh
nib build <input>
FlagAliasTypeDefaultDescription
--output-ostring./prototypeOutput directory
--template-tstringcleanTemplate: clean, presentation
--standalonebooleanfalseEmbed all assets for a single self-contained HTML file
--device-dstringDevice frame name (see nib devices)
--configstringPath to nib.config.json for hotspot navigation links

Offline-first

nib build only reads the .design.json file and writes HTML. It never connects to Pencil or any external service. Run it in CI, on a plane, or anywhere.

Hotspot links via nib.config.json:

json
{
  "links": [
    { "from": "Home", "nodeId": "btn-login", "to": "Login", "transition": "slide-left" },
    { "from": "Login", "nodeId": "btn-back",  "to": "Home",  "transition": "slide-right" }
  ]
}

Transition values: slide-left, slide-right, fade, none (default).

Examples:

sh
# Build from captured JSON
nib build my-design.design.json

# Build with presentation template
nib build my-design.design.json -t presentation

# Build standalone for sharing
nib build my-design.design.json --standalone

dev Prototypes

Start a local dev server with hot-reload on .pen changes.

sh
nib dev <file>

Pencil open required

Pencil.app must be running with the file open. nib dev re-captures the .pen file on every save — it needs the MCP server to read the live node tree.

FlagAliasTypeDefaultDescription
--port-pstring3142Port for the dev server
--template-tstringcleanTemplate: clean, presentation
--openbooleantrueOpen browser automatically

Examples:

sh
# Start dev server
nib dev my-design.pen

# Use a custom port
nib dev my-design.pen -p 8080

# Start without opening the browser
nib dev my-design.pen --no-open

devices

List all available device frames.

sh
nib devices

Available devices:

NameWidthHeightCategory
iPhone 16 Pro393852phone
iPhone 16 Pro Max430932phone
iPhone SE375667phone
Pixel 9412924phone
Samsung Galaxy S24360780phone
iPad Pro 13"10321376tablet
iPad Pro 11"8341194tablet
iPad Mini7441133tablet
MacBook Pro 16"17281117desktop
MacBook Pro 14"1512982desktop
MacBook Air 13"1470956desktop
Desktop 192019201080desktop
Desktop 14401440900desktop
Desktop 12801280800desktop

templates

List available prototype templates.

sh
nib templates
NameDescription
cleanMinimal prototype viewer — ideal for handoff and review
presentationSlide-style prototype with keyboard navigation and transitions

Released under the AGPL-3.0 License.