# Plan Design

> Generate a structured design plan markdown that respects the constraints in dragoon.json (spacing grid, type ratio, palette, font families). Forces a screens-and-flows breakdown, accessibility plan, responsive plan, and design review checklist gated on /critique and /slop. Use after /brief or before any UI work. Output goes to .dragoon/plans/plan-design-{slug}-{date}.md. Defaults to dry-run; pass --apply to write. Run as `node ~/.claude/skills/dragoon/skills/plan-design/scripts/plan-design.js "<idea>"`.

- Skill: `dragoon0x/plan-design` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add dragoon0x/plan-design`
- Raw SKILL.md: https://api.skillmd.com/api/skills/dragoon0x/plan-design/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: dragoon0x (https://skillmd.com/u/dragoon0x)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/dragoon0x/plan-design

---


# /plan-design

Generates a design plan template with your codebase's design constraints pre-loaded.

## When to use

- After /brief, before any UI implementation
- The user asks for "a design plan", "a design doc", "wireframes plan"
- Any feature that adds new screens or flows

## Output sections

- constraints (auto-loaded: grid, type ratio, palette, font families)
- the moment that matters (one sentence)
- screens & flows (entry, success, empty, error, loading)
- new tokens needed (colors, spacing, motion, typography)
- accessibility plan (keyboard, focus, screen reader, contrast, motion)
- responsive plan (mobile, tablet, desktop)
- review checklist (gated on /critique 80, /slop --severity high)

## Run it

```
dragoon plan-design "add user invites"
dragoon plan-design "add user invites" --apply
```

