Skills that let your AI agent build Whimsical boards for you, through the Whimsical MCP. Each one is a standard Agent Skills folder, so it works in Claude, Cursor, Codex, GitHub Copilot, Gemini CLI and other agents that read skills.
| Skill | What it does | Try |
|---|---|---|
| App Wireframe | Turns any app into editable lo-fi wireframes: name an app to pull its screens from Mobbin, or bring your own screenshots. See 20 example boards. | Make wireframes of Airbnb |
| Renewal Timeline | Turns the emails behind a customer or contract renewal into a timeline of every offer and counter-offer, with a pricing table, and writes the renewal summary: terms, NRR, usage, open items. | Build the renewal timeline for Initech |
These skills are new, and mostly written with coding agents. If something breaks in your setup, please open an issue.
Every skill needs the Whimsical MCP, and some need another MCP server too. Each skill's guide, linked above, lists them and covers the rest of the setup.
With Node.js installed, run this in a terminal, with the skill's name, then add the Whimsical MCP:
npx skills add WhimsicalCode/skills --skill app-wireframe --agent claude-code -g
claude mcp add --transport http --scope user whimsical https://mcp.whimsical.com/mcp-g makes the skill available in every folder. Add any other MCP server the skill's guide
lists the same way, and skip the ones claude mcp list already shows. Then start Claude
Code, run /mcp and sign in.
Or install it as a plugin, which adds the MCP servers for you:
/plugin marketplace add WhimsicalCode/skills
/plugin install app-wireframe@whimsical
- Download the skill's zip from the
latest release, for example
app-wireframe.zip. - In Claude, open Customize (on claude.ai, claude.ai/customize/skills), click Add, then Upload skill, drop the zip and click Upload.
- Still in Customize, under Connectors, add Whimsical and any other connector the skill's guide lists.
With Node.js installed, run this in a terminal, with the skill's name and your agent:
npx skills add WhimsicalCode/skills --skill app-wireframe --agent cursor -gReplace cursor with codex, github-copilot, gemini-cli or
another agent's name.
This copies the skill where your agent looks for skills, using the open
skills installer. Without Node.js, unzip the
skill's zip from the latest release
into that folder yourself. Either way, then add the MCP servers the skill's guide lists,
following your agent's MCP setup guide.
skills/<name>/ each skill: SKILL.md, references/, scripts/
docs/<name>.md each skill's guide: what it does, install, use, privacy
docs/covers/ each skill's cover for whimsical.com, and how to make one
tests/<name>/ each skill's tests, outside the skill so they stay out of its zip
tests/repo/ checks every skill against the conventions
.claude-plugin/marketplace.json the Claude Code catalog: each skill's version and MCP servers
.github/workflows/ tests on every change; a release zip of every skill per tag
CONTRIBUTING.md explains how to change or add a skill, and CONVENTIONS.md the rules every skill follows.
The skills don't collect anything. Your agent talks to Whimsical and any other service through their own MCP servers. SECURITY.md explains what the skills can access and how to report a problem.