sdtk-design — Command Reference

Design & prototyping CLI. Guide: SDTK-DESIGN.

npm install -g sdtk-design-kit   # included in sdtk-kit
sdtk-design --help

Workspace

sdtk-design init

Initialize the design workspace (docs/design/, internal state under .sdtk/design/).

sdtk-design init

sdtk-design status

Show where the current design flow stands.

sdtk-design status

Start a design flow

sdtk-design start

Entry point for both flows:

# idea flow
sdtk-design start --idea "<one-paragraph MVP idea>" --style premium-dashboard

# spec-driven flow
sdtk-design start --from-spec . --profile b2b-commerce
sdtk-design start --from-spec . --reference-dir ./docs/design/reference-export --profile b2b-commerce

Option	Description
--idea "<text>"	Rough MVP idea (idea flow)
--from-spec <path>	Consume explicit SDTK-SPEC design artifacts (does not parse raw prose)
--style <preset>	Visual style preset (see styles)
--profile <profile>	Domain profile for spec-driven flow (e.g. b2b-commerce)
--reference-dir <path>	Read-only reference export mapping

Stage-by-stage verbs

sdtk-design brief --idea "<idea>"        # design brief only
sdtk-design screens                      # screen map
sdtk-design wireframe --screen landing   # one screen's wireframe
sdtk-design system --style minimal-saas  # design system doc
sdtk-design prototype                    # static prototype (supports --force)

Review & handoff

sdtk-design review --artifact docs/design/prototype/index.html
sdtk-design handoff

review writes dated evidence to docs/design/reviews/; handoff produces DESIGN_HANDOFF.md for SDTK-CODE.

Preview Studio

sdtk-design preview   # render prototype, annotate, live-tweak tokens
sdtk-design open      # always-open studio (empty-state + Style Gallery if no prototype)
sdtk-design styles    # Style Gallery only — choose-only, writes nothing

The studio serves the prototype read-only and writes only under docs/design/feedback/ (schema sdtk.design.feedback.v1). It never runs the agent itself.

Brand-Match (Pro)

Extract a client site's real brand from its URL, then design on-brand. Requires the Pro design.client.loop entitlement.

sdtk-design brand ingest <url>   # HTTPS GET + CSS parse → docs/design/brand/raw-extraction.json
sdtk-design brand check          # WCAG AA contrast guard over the curated brand-profile.json
sdtk-design direction start --brand docs/design/brand/brand-profile.json

Command	Description
brand ingest <url>	Fetch the live stylesheet and extract colours (ranked by usage × saturation), type stacks, and a logo pointer into raw-extraction.json. Deterministic; declares confidence: ok | low.
brand check	Fail loud if any text/button pair in the curated brand-profile.json is below WCAG AA.
direction start --brand <profile>	Seed the Direction Round so candidates open in the client's brand.

Option	Description
--out <path>	(ingest) Extraction output path. Default docs/design/brand/raw-extraction.json
--brand <path>	(check) Curated profile path. Default docs/design/brand/brand-profile.json
--project-path <path>	Target workspace
--json	Machine-readable output

The agent curates raw-extraction.json → brand-profile.json (brand-hue anchor + curated complements). Best-effort + human-reviewed — reads one page's CSS only, no browser/screenshot/vision, no full-site clone.

Style presets

minimal-saas        SaaS & Productivity
premium-dashboard   Dashboard & Data
bold-founder        Marketing & Launch
warm-editorial      Editorial & Content
ecommerce-retail    E-Commerce & Retail
fintech-trust       Fintech & Data
editorial-content   Editorial & Content