Frontman Docs
Frontman is an open-source AI coding agent that runs inside your development browser. You chat with it in natural language or point at elements on your page, and it edits your actual source files — with instant hot reload so you see changes immediately.
Who uses Frontman?
Section titled “Who uses Frontman?”Developers set up Frontman in their project (a one-line integration for Astro, Next.js, or Vite) or install the WordPress plugin. The agent sees the rendered experience plus the underlying source or CMS context, so it makes precise edits you can review.
Designers, PMs, and non-technical teammates use the chat UI to make changes directly. Select an element, describe what you want (“make this button larger,” “change the heading text,” “swap the layout to two columns”), and the agent handles the code. No IDE required.
Where to go from here
Section titled “Where to go from here”Setting up Frontman
Section titled “Setting up Frontman”Start here if Frontman isn’t running in your project yet.
| Framework | Install command | Docs |
|---|---|---|
| Astro | astro add @frontman-ai/astro | Astro integration → |
| Next.js | npx @frontman-ai/nextjs install | Next.js integration → |
| Vite | npx @frontman-ai/vite install | Vite integration → |
| WordPress | WordPress Plugin Directory (beta) | WordPress setup → |
Then continue with:
- API Keys & Providers — Configure your AI model with OAuth or a provider API key
Learning to use Frontman
Section titled “Learning to use Frontman”Already running? Learn how to get the most out of it.
- How the Agent Works — Understand the screenshot → read → edit loop
- Sending Prompts — Write effective prompts with good examples
- Annotations — Point at elements instead of describing them
- Prompt Strategies — Patterns for getting better results over time
- Best Frontend Coding Agent guide — Compare tools if your team wants to build frontend with AI
Deep dives
Section titled “Deep dives”For developers who want framework-specific detail or technical reference.
- Integrations — Framework-specific guides (Astro, Next.js, Vite, WordPress)
- Reference — Configuration options, environment variables, architecture, troubleshooting
