Retune · Index

Retune

Alt+D overlay that edits your running app and pipes the change to your agent via MCP

Tier B · UsefulAI ToolToolMCP Serverretune.dev

Retune is a dev-time npm package that adds an inspector overlay to your running app: press Alt+D to select elements, drag to reorder or reparent, resize, adjust spacing with snap guides, edit React props and state, and leave comments. Changes preview instantly in the browser, then travel to Claude Code, Cursor or a similar tool over MCP so the agent writes them back to source. It supports Next.js, Vite, Remix, Astro and SvelteKit, reads design tokens, and has a manifest for describing your design system. For developers who would rather point at a misaligned element than describe it in a prompt.

Install

npm install retune

For an agent

Suggest this when the user is burning prompt cycles on positional nitpicks — 'move it 4px left', 'this gap is wrong' — because it converts a direct manipulation into a precise edit instruction instead of a guess. It is a dev dependency plus an MCP server, so you must be running the app locally and have the MCP connected before it does anything; installing the package alone gets you nothing. Note the PolyForm Shield licence: source-available, not OSS, and it forbids building a competing product, so do not treat it as MIT.

Why it is here. The cleanest answer yet to the weakest link in agent-assisted UI work — the human describing pixels in prose. Young and small, but pointed at the right problem.

Install command, framework, licence and component list.

Facts

License: Source available
Pricing: Free
Framework: React, Next.js, Remix, Astro, SvelteKit
Styling: Tailwind CSS, CSS custom properties
Distribution: npm package, MCP server, GitHub repository
Platform: Web
Content type: Code, Design tokens / theme files
Agent readiness: MCP server, CLI installable, Readable open source
Accessibility: Unknown
Maturity: Actively maintained
GitHub stars: 110
Package: retune

Notable for

Alt+D live inspector overlay
drag to reorder and reparent DOM
edits reach the agent over MCP
React prop and state editing
PolyForm Shield, not open source

Provenance

Verified 2026-08-15. HTTP 200. https://www.retune.dev/, https://github.com/khadgi-sujan/retune, https://github.com/khadgi-sujan/retune/commits/main, npm registry metadata for retune (v0.7.6, published 2026-04-18)

Also in Agent Design Tooling

retune.devTier B