idantas

Ilse — Development skill for Claude Code

Development community

The designer's eye inside the code agent — point at what's wrong in the browser, your agent fixes it in the code.

How to install Ilse

This entry records only its repository, not the path inside it, so there is no exact command to give. Open idantas/ilse and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Ilse does

The designer's eye inside the code agent — point at what's wrong in the browser, your agent fixes it in the code.

Alternatives in Development

  • Brainstorm Ideas Existing — Brainstorm product ideas from PM, Designer, Engineer perspectives 7.8k ★
  • Auto — Smart router - Single entry point with natural language intent detection 2.8k ★
  • Agentlas — Agentlas commands — one entry point for network, build, storm, call, and the rest 1.1k ★

README

Ilse

**The designer's eye inside the code agent.**

Point at what's wrong in the browser. Your agent fixes it in the code. You approve.

cd your-react-project
npx github:idantas/ilse

That's the whole setup. No import, no changes to your project.

Or ask your coding agent:

Install and run Ilse in this project — see https://github.com/idantas/ilse

Ilse 0.5 isn't on npm yet, so this installs straight from GitHub and builds on the first run (takes a minute). To keep the command around, install it once — in two steps, because npm can't build a package during a global install straight from git:

npm pack git+https://github.com/idantas/ilse.git   # builds the package from GitHub
npm install -g ./ilse-design-*.tgz                  # installs it as `ilse` / `ilse-design`

Step by step

**Once**

  1. Have a code agent installed and logged in: Claude Code, Codex, Cursor CLI or Gemini CLI. For the MCP mode, an agent app like Claude Desktop is enough.
  2. The first time you run Ilse, pick a mode:
    • Automatic (recommended): Ilse calls your agent. Nothing to say, nothing to paste.
    • From your agent's chat (MCP): your agent pulls the annotations. See Connect your agent.
    • Clipboard: Ilse copies each annotation and you paste it anywhere.

**Every time**

  1. Terminal 1, in your project: npm run dev.
  2. Terminal 2, same folder: npx github:idantas/ilse (or ilse-design, if installed globally). Add --mode mcp to use the MCP mode for this run only.
  3. Work on http://localhost:4700 instead of your usual dev URL.
  4. Click an element, write what should change or tweak it in the property panel, and send.
  5. The change appears in the page. Don't like it? ⌘Z / Ctrl+Z.

**MCP mode only