Skills for Claude Code that add motion, micro-interactions and design systems to web, Android (Jetpack Compose) and Apple (SwiftUI) interfaces, with an interaction plan you approve before any code is written.
Claude Code
> /plugin marketplace add AThevon/genjutsu> /plugin install genjutsu@genjutsu
Codex
$ npx skills add AThevon/genjutsu -a codex
Cursor
$ npx skills add AThevon/genjutsu -a cursor
Gemini CLI
$ npx skills add AThevon/genjutsu -a gemini-cli
GitHub Copilot
$ copilot plugin marketplace add AThevon/genjutsu$ copilot plugin install genjutsu@genjutsu
OpenCode
$ npx skills add AThevon/genjutsu -a opencode
Windsurf
$ npx skills add AThevon/genjutsu -a windsurf
Website · Examples · Documentation · Install · Discussions
genjutsu.athevon.dev, built with genjutsu. Hover the 幻 and the lens shows the code its ink is drawn from.
Creative coding skills for Claude Code, claude.ai and Cowork. Web (React, Vue, Svelte, Astro, vanilla CSS, Three.js, Canvas), Android (Jetpack Compose, Compose Multiplatform) and Apple (SwiftUI, iOS and macOS). bunshin is web only for now.
npx skills add https://genjutsu.athevon.dev -g
Then describe the task in Claude Code, or type /genjutsu. To follow releases: npx skills update -g. Keep the -g on both, and use the URL, not the repository: npx skills add AThevon/genjutsu installs the skills without their modules.
Or as a Claude Code plugin, inside a session, which gives you /genjutsu:cast, /genjutsu:paint and /genjutsu:bunshin:
/plugin marketplace add AThevon/genjutsu
/plugin install genjutsu
Project scope, claude.ai, Cowork, other agents and what bunshin needs beside it: genjutsu.athevon.dev/docs/install.
The requests in the middle column are examples of what you might type, not recorded runs.
| You type, for example | You get | |
|---|---|---|
castone interface moves | /genjutsu:cast make the pricing cards feel physical on hover | An interaction thesis you approve, shown the way you pick (a rendered page with a replay button, a route in your project, or one sentence), then the code in the stack you already use, with a short audit of what it wrote. |
painta product's whole look | /genjutsu:paint build me a portfolio from scratch | A brainstorm, a visual and an interaction thesis, a MASTER.md design system for your stack, the page, and a full audit. On a project that already has a design, it asks first whether to keep the brand, change part of it, or redesign. |
bunshina whole site, by a team of agents | /genjutsu:bunshin redesign our architecture practice's whole site from the current one and our project PDFs | It states its cost, then asks you twice: the tier, then the direction. An art director runs research, one builder per page, reviewers and fix rounds until a stop rule ends the loop. You get the site, DESIGN.md, AGENTS.md and a report of what was verified and what was not. |
Not sure which one? Ask for the result you want and the right skill is picked; cast and paint propose bunshin once, with its cost, when the brief is a whole site. The FAQ has the long answer.
Recorded runs on fictional clients and one real one, captured from the code each run left or, for the real client, from the live site. Each one gives the first line of the request, how it ran, what it cost, and a receipt with the full prompt, what the run checked, and what it left unverified or got wrong. Everything they link lives in genjutsu-examples at the tag readme-2026-10-05: the code each run wrote, its receipt, its conversation and its media. Each one also runs as a live demo, built from that code as it stands. A one-shot headless run is a single claude plugin eval session: the prompt answers the gates up front and nobody replies after that, so there is no conversation to publish. A conversation is a session in which an agent plays the client and answers the gates; its full transcript, the brief that agent was given and the first message it sent are linked. The bunshin example is the run bunshin was extracted from, made before v4.1.0 shipped: its cost is in subagent tokens, as genjutsu publishes it, and its request and its client's material stay private. A run on a build that is not a release names the branch and commit it ran on instead of a version.
/genjutsu:paint build the landing page for Nocturne, the late program of a planetarium in Lisbon.
A new page from an empty React template and a star catalogue. After questions on the mood and the hero, and its two theses shown as a rendered page, the run drew the dome from data/stars.json: 403 stars and Saturn where they stand over Lisbon at 22:00 on 9 October 2026. Scrolling from dusk to night deepens the ground, fades the amber glow at the rim and brings the stars up brightest first. 1440x900 viewport, scaled to 1100x688.
The client accepted both theses at the first showing and asked once for the four problems of the first report to be fixed. The run never saw its page and handed every visual check over. Three defects it introduced are in the receipt: from 1100 px wide the star list runs over the dome (near the end of the clip), a picked star's magnitude line covers its name, and on a phone the hero panel hides the bottom of the dome.
paint · conversation with an agent playing the client (Claude Code 2.1.289, one session resumed for each reply) · genjutsu fix/skill-arguments on 09c177b (4.1.1 candidate) · claude-opus-5-5 · first pass · $5.93 (plus $0.86 for the agent playing the client) · 8 exchanges · 73 turns · 0 human edits · 2026-10-04
Receipt · Transcript · Client brief · First message · Source · Live demo
Made with bunshin: a short request, in French, for a polished first draft of a private chef's site, built from his public Instagram profile.
A real client's site, from his public Instagram profile and two answers: the stack, the lead offer, the languages and the contact in one round of questions, then the direction, L'Affiche de la Riviera. Seven pages in French and English. Scrolling the home, the noon-yellow sky turns to sunset orange as the plate-sun sets behind the cobalt horizon, before the two doors, Recevoir and Conseiller, and the first plates. Filmed from the live site, 1440x900 viewport, scaled to 1200x750.
This is the run bunshin was extracted from, made with genjutsu 4.0.0's paint and Impeccable hours before bunshin shipped in 4.1.0; its cost is the figure genjutsu publishes for it. The second verdict still asked for fixes (five major points from the art director); the last round worked on them and no verdict read the site after it. The client's contact details and legal notice are still blanks marked for him to fill.
bunshin · bunshin run, before v4.1.0 (Claude Code 2.1.284, one main session driving subagents through eight workflows) · genjutsu 4.0.0 at a0f6e09 (paint, with Impeccable) · claude-opus-5-5 · about 10.5M subagent tokens over six to eight hours (main session not measured) · one review, three refine rounds, two verdicts · 2 human answers · 0 human edits · 2026-09-29
Receipt · Live demo · Source: the client's private repository
/genjutsu:cast pin our pottery studio's four firing stages and scrub them with the scroll
The Atelier Grès page, its copy and its four stage blocks are the starting fixture. The run's work is the pinned section, the firing curve it draws, and the stage texts handing over to each other as the scroll scrubs through. 1440x900 viewport, scaled to 1200x750.
Headless, so the run marked its own thesis UNVALIDATED. It could not build in its sandbox; the build here passed on the first try with no edit.
cast · one-shot headless run (claude plugin eval, Claude Code 2.1.289) · genjutsu 4.1.0 at 09c177b · claude-opus-5-5 · first pass · $1.53 · 23 turns · 0 human edits · 2026-10-04
Stars on GitHub
A development methodology for coding agents that makes the agent brainstorm before building, follow plans, run parallel work and finish branches in a disciplined way. You get fewer skipped steps and more consistent results from your coding assistant.
@obraHelps you take a change from a rough idea or bug report through to a tested, reviewed result, with each step handled by a focused skill. Its skills cover pinning down domain terms, designing module interfaces, diagnosing hard bugs, and reviewing changes against your repo's coding standards.
@mattpocockGives your coding agent a planning, testing and review routine to follow on every task. It plans before building, checks changes with tests, has a fresh reviewer look for regressions, and saves repeated wins as reusable skills.
@affaan-mDeveloper tools for working on the React codebase itself. Provides skills for extracting error messages, managing and debugging feature flags across release channels, running Flow type checks, and fixing lint and formatting issues before committing.
@facebookInstall it with the command on its page. It includes bunshin, cast, paint. Its skills do not fire on their own yet. Free and open source.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it