0xnyn/airship

What it solves

Airship is a visual editor for your codebase that allows you to modify your UI directly from a browser-based design canvas. It eliminates the need to switch between a separate design tool and your code editor by allowing you to select elements in your running app and describe changes using AI agents.

How it works

Airship acts as a proxy that sits in front of your existing dev server (supporting Vite, Next, Remix, Rails, etc.). It provides a visual interface where you can select elements, which Airship then maps to the exact file and line of code that generated them. You can then use integrated AI agents (Claude Code, Codex, or OpenCode) to apply edits to your source files based on your descriptions.

Who it’s for

Frontend developers and designers who want to iterate on UI changes rapidly without manually hunting for the same element in the code or rebuilding the UI in design tools.

Highlights

• Zero Configuration: No plugins or dependencies are added to your project bundle or configuration.
• Multi-Device Preview: View and edit your app across multiple live frames (e.g., desktop and iPhone) side-by-side on an infinite canvas.
• Integrated AI Agents: Support for Claude, Codex, and OpenCode with options for sandboxed execution (--safe mode) to protect your project files.
• Local-First: Everything runs on your machine with no accounts, telemetry, or external services required.
• Detailed Inspector: Includes a CSS box model viewer, DOM tree navigator, and layout controls.