open-design

name	open-design
description	Route design-generation work into the right Open Design workflow mode — prototype, deck, document, or media artifact. Use when the user needs local-first UI prototype generation, presentation deck creation, or design-system-aware HTML/PDF/PPTX artifacts via locally-installed coding agents. Supports 72 built-in design systems, 5 visual directions, 93 media prompt templates, and multi-format export. Triggers on: open-design, local design tool, prototype generation, design deck, design artifact, design agent workflow, open design prototype, design system artifact, UI prototype generation.
allowed-tools	Bash Read Write Edit Glob Grep WebFetch
compatibility	Requires Node.js ~24 and pnpm 10.33.x. Run `pnpm tools-dev run web` to launch the local UI. Auto-detects 13+ coding agent CLIs (Claude Code, Cursor, Gemini CLI, GitHub Copilot, etc.). Extend with file-based skills in the `skills/` directory. Plugin install via `claude plugin marketplace add nexu-io/open-design`.
license	MIT
metadata	{"tags":"open-design, design-tool, local-first, prototype, deck, ui-generation, multi-format, design-system, media-generation, html-export, pptx-export","version":"1.0","source":"https://github.com/nexu-io/open-design","platforms":"Claude, Gemini, Codex, ChatGPT"}

open-design — local-first design artifact generation

Keyword: open-design · local design tool · prototype generation · design artifact

Open-source alternative to Anthropic's Claude Design — generates web, mobile, and desktop prototypes, decks, and media artifacts using coding agents already installed on your machine.

Open Design is most useful when you choose the smallest generation mode that fits the job:

• start with a prototype before reaching for a full deck
• pick one design system before layering custom styles
• choose one output format (HTML review before PDF/PPTX export)
• use the Turn 1 discovery form to reduce redirect cycles before generation begins

When to use this skill

• The user needs a local-first UI prototype, presentation deck, or document artifact from a single prompt
• The user wants to generate design artifacts using coding agents they already have installed (Claude Code, Cursor, Gemini CLI, etc.)
• The user wants to apply one of 72 built-in design systems (Linear, Stripe, Vercel, Notion, Apple, etc.) to their output
• The user needs multi-format export: HTML review → PDF, PPTX, ZIP, or Markdown
• The user wants AI-generated images, video, or audio media embedded in design artifacts
• The user wants to extend Open Design with custom file-based skills or install it as a Claude Code plugin

Do not use this skill when

• The task is live UI component authoring in a real codebase → route to stitch-skills or design-system
• The task is video production or Remotion animation → route to video-production
• The task is a data-driven presentation deck without design-system application → route to presentation-builder
• The task is compressing or optimizing existing media files → route to compresso
• The task is a broad web UI critique or audit → route to web-accessibility

Instructions

Step 1: Capture the generation mode

Collect the minimum packet before choosing a workflow:

• Output type: UI prototype, presentation deck, landing page, document, or media artifact
• Design system: one of the 72 built-ins (Linear, Stripe, Vercel, Notion, Tesla, Apple…) or custom
• Visual direction: one of 5 directions (minimal, bold, playful, enterprise, dark)