Frontman
The AI agent that lives in your framework/browser
Last verified:
What is Frontman?
Frontman is an open-source AI coding agent that lives inside your browser and your framework's dev server, not your code editor. You click any element in your live application, describe what you want in plain English, and watch the actual source code get edited in real time with instant hot reload. It sees the full runtime context — the real DOM, component tree, CSS styles, routes, and server logs — which file-level AI agents miss.
Key features include visual point-and-click component selection, live DOM and style inspection, automatic compilation error detection and fixing, device breakpoint preview (iPhone, iPad, desktop), BYOK model support with API keys from Anthropic, OpenAI, or OpenRouter, and support for reading agent instruction files like agents.md or claude.md. The interface shows a chat window alongside a live preview of what the agent is working on, and you can commit and push to Git without leaving your browser.
Frontman is built for frontend developers who want faster iteration with richer context than terminal-based AI tools, as well as designers, product managers, and semi-technical teammates who need to make UI changes without opening an IDE. It supports Next.js (App Router, Pages Router, Turbopack), Astro (SSR, SSG, Islands), Vite (React, Vue, Svelte), and WordPress (as a plugin with tools for posts, pages, blocks, Elementor, menus, templates, widgets, settings, and WooCommerce).
The core is open source under Apache 2.0 / AGPL-3.0 licenses, with hosted plans coming soon. Every prompt, tool call, and context the agent uses is visible in the source code on GitHub. For JavaScript frameworks, Frontman runs in development only and produces standard code diffs that go through your team's normal review process — nothing gets merged without engineer approval.
Frontman pricing
Pricing model: Freemium
Open-source core available under Apache 2.0 / AGPL-3.0 licenses with free self-hosted local development. BYOK model support lets you use your own API key from Anthropic, OpenAI, or OpenRouter for local development. Hosted plans are coming soon but not yet available. No paid tiers currently listed on the website.
Frontman pros
- Open-source core with transparent AI prompts and tool calls
- Sees live DOM, CSS styles, and component boundaries at runtime
- Visual point-and-click element selection in the browser
- Instant hot reload — changes appear immediately
- No IDE required — works entirely in the browser
- Designer and PM friendly — no coding skills needed
- Framework-aware for Next.js, Astro, Vite, and WordPress
- BYOK model support with Anthropic, OpenAI, or OpenRouter keys
- Automatically detects and fixes compilation errors
- Device breakpoint preview for iPhone, iPad, and desktop
- Edits real source files in your repo, not sandbox copies
- Produces standard git diffs for team review and merge
- Reads agents.md, claude.md, and custom rule files
- Works alongside your existing code editor
- One-command installation for Next.js, Astro, and Vite
Frontman cons
- JavaScript framework integrations only work in development, not production
- Hosted plans not yet available — only open-source self-hosted option
- Requires framework dev server to be running (local development)
- Experimental software — backups and staging recommended
- WordPress plugin in production is experimental and requires caution
- BYOK requires your own API key subscription from AI providers
- Only supports Next.js, Astro, Vite, and WordPress (limited framework support)
- Team still needs engineers to review and approve all code changes
Frequently asked questions about Frontman
What is Frontman?
Frontman is an AI agent that lives inside your app, not your editor. It plugs into your framework, giving anyone on your team a chat interface alongside a live view of your app. Describe what you want to change, and the agent makes it happen — outputting real code your team can review and merge.
How is this different from Cursor or Claude Code?
Cursor and Claude Code work at the file level — they read your code but don't understand your running application. Frontman is wired into your app's runtime. It sees your component tree, routes, server logs, query performance, and everything happening live. That deep context means better results, faster.
Who is Frontman built for?
Frontend developers who want faster iteration with richer context than terminal-based AI tools. But also designers, product managers, and other semi-technical teammates who need to make changes — from tweaking copy and structure to exploring entirely new feature ideas — without opening an IDE.
Is it open source?
Yes. Frontman is open source on GitHub at github.com/frontman-ai/frontman. Every prompt, every tool call, and every piece of context the agent uses is visible in the source. Licenses vary by package and integration, and are declared in the repository and release artifacts.
What can I actually do with it?
Implement a design change from a Figma mockup. Explore a new feature idea end to end. Tweak page structure or copy. Fix styling issues. Anything involving your frontend and fullstack application — described in natural language, executed as real code.
What does the interface look like?
For JavaScript frameworks, navigate to localhost/frontman in your browser. For WordPress, open your site's /frontman route. In both cases you get a chat interface alongside a live preview of what the agent is working on.
Isn't it dangerous to let non-engineers change code?
For JavaScript frameworks (Next.js, Astro, Vite), Frontman runs in development only — never in production. Every change produces a standard code diff that goes through your team's normal review process. Nothing gets merged without an engineer approving it.
Which frameworks are supported?
Frontman supports Next.js, Astro, Vite, and WordPress. For JavaScript frameworks it integrates as middleware, turning your local dev server into an MCP server. For WordPress it installs as a plugin that exposes WordPress-specific tools for posts, pages, blocks, Elementor content, menus, templates, widgets, settings, and WooCommerce when active.
How does it get context about my app?
Frontman gets context from the runtime it is installed into. For JavaScript frameworks, it hooks into your local dev server and browser tools. For WordPress, the plugin exposes WordPress-native content, template, menu, widget, option, Elementor, and WooCommerce tools directly from the running site. In both cases, the agent queries live runtime context instead of relying only on static files.
Can the WordPress plugin run in production?
Yes — unlike the JavaScript framework integrations which are development-only, the WordPress plugin can run on a live site. WordPress sites are often edited directly in production, and the plugin respects that workflow. That said, this is experimental software. Use it with care: start on a staging site, keep backups, and review changes before relying on it in production.