Updated 6mo ago
by agilek
wireframer-skill
Agent skill for generating low-fidelity, hand-drawn web wireframes. Balsamiq-style SPAs using wired-elements web components and react-doodle-icons. Supports React, Vue, Svelte, and vanilla HTML.
50 GitHub stars (50)
+10 in 16 days
| Period | New stars |
|---|---|
| Oct 1 | 0 |
| Oct 2 | 0 |
| Oct 3 | 0 |
| Oct 4 | 0 |
| Oct 5 | +1 |
| Oct 6 | 0 |
| Oct 7 | 0 |
| Oct 8 | 0 |
| Oct 9 | +1 |
| Oct 10 | 0 |
| Oct 11 | 0 |
| Oct 12 | +2 |
| Oct 13 | 0 |
| Oct 14 | +1 |
| Oct 15 | +2 |
| Oct 16 | +3 |
- 1 skill (1 skills found in its SKILL.md files)
- 3 forks (3 forks)
- 6mo ago last update (Last updated 6mo ago)
Install
Skills CLI
npx skills add agilek/wireframer-skill
Asks which agents to install it for. Add -g to install it for every project.
Claude Code
git clone https://github.com/agilek/wireframer-skillcp -r "wireframer-skill" ~/.claude/skills/wireframer-skill
Copies the wireframer skill into ~/.claude/skills/ for every project (use .claude/skills/ for one project).
Plugin
/plugin marketplace add agilek/wireframer-skill
Run inside Claude Code if the repository ships a plugin marketplace, then pick plugins from /plugin.
Skills can run code on your machine — read the SKILL.md first.
What it does
In the author's own words, from each skill's SKILL.md.
-
wireframer
Use this skill to generate a wireframe, mockup, or low-fidelity clickable prototype of any web UI. Invoke whenever the user mentions wireframing, mocking up, prototyping, or sketching out a UI — including phrases like "lo-fi prototype", "rough layout", "Balsamiq-style", "hand-drawn UI", "clickable prototype", "sketch the screens", "visualize the flow", or "show what the app would look like". Also…
SKILL.md on GitHub (opens in a new tab)
No skill matches that filter.
Review before you install
A skill is a set of instructions and scripts your agent will follow, and it can run code on your machine. Read the SKILL.md and any scripts first — this listing is not a security review.