Ilse

The designer's eye inside the code agent.

You open your app in the browser, point at what's wrong and say how it should be — or adjust it right there, like in Figma. Your AI coding agent changes the code. You see the result on the page, and keep it or undo it.

Side project, in beta. Made by a designer, for designers who work with code agents. Free and open source.

What you can do

• Point and say. Click an element, select a piece of text or draw an area, and write what should change: "more space between the cards", "this title should be stronger".

• Adjust it yourself. A property panel like Figma's: size, layout, spacing, typography, colors, borders. You see the change live before sending it.

• Edit text and remove things. Retype a text right in the panel, or remove an element.

• Move things around. Drag to reorder, move into or out of a container, resize.

• Draw it. Sketch on the page with the pencil, or paste a screenshot as a reference.

• Undo anything. ⌘Z puts the code back exactly as it was. No need to ask the AI to revert.

Related MCP server: ui-ticket-mcp

What you need

• A React project that runs on your computer (Next.js, Vite…).

• An AI coding agent installed and logged in: Claude Code, Codex, Cursor CLI or Gemini CLI.

Ilse uses your agent and your account. It has no account, key or server of its own, and nothing leaves your machine.

Try it

In your project's folder, with the app running (npm run dev), open a second terminal and run:

npx github:idantas/ilse

Ilse opens your app at http://localhost:4700 with its toolbar on top. Work there instead of your usual address. The first run asks a couple of questions and takes about a minute.

Not comfortable with the terminal? Ask your agent: "Install and run Ilse in this project — see https://github.com/idantas/ilse".

What it costs

Ilse runs on your agent's plan, so it uses that plan's limits. It always picks the cheapest way that works:

• Panel adjustments that map to a class in your code are made by Ilse itself — no AI, instant, nothing from your plan.

• Small requests go to a fast, cheaper model: a few seconds.

• Bigger ones (new screens, structure) go to the full agent — the most expensive step, so it's used only when needed.

Go deeper

• How it works — how Ilse finds the code, the cost ladder, models, safety checks, usage limits, undo and commits.

• Reference — commands, settings, connecting your agent over MCP, logs, compatibility.

• AGENTS.md — for contributors and their agents.

Why "Ilse"

AI freed designers from the execution bottleneck, but craft still needs human judgment. Ilse is the designer's eye inside the agent: you point at what's wrong, the agent fixes it, you approve.

"Design is a tool for improving humanity." — Ilse Crawford

Contributing

Issues and pull requests are welcome — see CONTRIBUTING.md. Security problems go privately: SECURITY.md.

MIT license — see LICENSE.