# Visual Design

> Use when a UI-bearing target needs its visual design system produced or confirmed current: design tokens, palette, typography, spacing, iconography, component style guide, design-tool file link, and a wireframe index mapping each in-scope screen to its wireframe. This is the visual_design action of the design stretch — one Agent-tool dispatch with subagent_type ui-ux-developer — applicable to UI-bearing capabilities/features only (skip for backend-only design passes), and it ends at a mandatory human-approval checkpoint: detailed-prototypes must not begin until the human has approved this action's output.

- Skill: `bhangeef16/visual-design` (Agent Skill)
- Install (CLI): `npx skillmds@latest add bhangeef16/visual-design`
- Raw SKILL.md: https://api.skillmd.com/api/skills/bhangeef16/visual-design/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Design & Media
- Author: BhangeeF16 (https://skillmd.com/u/bhangeef16)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/bhangeef16/visual-design

---


# Visual Design

Produce (first run) or confirm current (later runs) the target's design system and wireframes. A pass here does not advance on its own — it stops for mandatory human approval.

## Dispatch

One synchronous `Agent`-tool call, `subagent_type: ui-ux-developer`. Skip this action entirely for backend-only design passes — skipping is a recorded decision at the checkpoint, not a silent omission.

## Required inputs

- `planning.md`.
- finalize-promoted-knowledge output with no unresolved questions.
- The target's cross-cutting design constraint and candidate token table (the seed palette — do not invent a fresh direction unprompted).
- The screen/actor inventory for the target.

## Required outputs (all mandatory)

- `design-system.md` created (first run for this capability) or confirmed still current (later runs) — tokens, palette, typography, spacing, iconography, component style guide, and the design-tool file link.
- A wireframe index mapping each in-scope screen to its wireframe node/link in the design tool.

## Rules — mandatory approval gate

- On pass or pass_with_risks, the run stops for manual approval. The human's recorded approval — not the passing result — is what allows detailed-prototypes to begin. Report the approval as obtained only when it genuinely was.

## Result

Report each required output produced (with its location), the result (pass / pass_with_risks / blocked / failure), blocking questions as an explicit list, and the explicit note that the run is now holding for human approval.