Quick start guide

This is the fastest path from "empty repo" to "AI agent generating on-brand UI". Five commands, two minutes.

1. Install the CLI

The CLI is a single npm package. You can install it globally or invoke it through npx:

# globally
npm install -g designdrop
 
# or one-shot
npx designdrop --help

The CLI works without an account for everything in the public library. You only need to sign in to use the URL generator or save designs to your workspace.

2. Browse the library

designdrop list
designdrop search "saas"

list shows all curated brand-inspired design systems. search does substring matching across names, descriptions, and categories. Both commands also accept --json if you want to pipe into another tool.

3. Add a DESIGN.md to your project

cd path/to/your/project
designdrop add stripe

This drops DESIGN.md at the project root. You can override the destination with --out and force overwrite with --force. Running designdrop add --help lists every flag.

4. Point your AI agent at it

Most agents auto-discover DESIGN.md at the repo root. For Claude Code:

# nothing to configure — Claude Code reads DESIGN.md automatically
claude "Build a pricing page that follows DESIGN.md"

For Cursor / v0 / Bolt / Lovable, see Export & integration for per-tool instructions.

5. Iterate in the editor

When you want to deviate from the source brand, open the file in the visual editor:

designdrop open

You can adjust tokens, see live previews, and validate against WCAG contrast rules. Save the result back to DESIGN.md and your agent picks up the change on its next read.