What is browser-agent-template?

browser-use/browser-agent-template — explained in plain English

Analysis updated 2026-05-18

★ 56TypeScriptAudience · vibe coderComplexity · 2/5LicenseSetup · moderate

Mindmap

mindmap
  root((browser-agent-template))
    What it does
      Browse real web
      Live browser panel
      Streaming chat UI
    Components
      Next.js frontend
      Vercel eve agent
      Browser Use cloud
    Setup
      One-click Vercel deploy
      Browser Use API key
      AI model credential
    Customization
      Rename agent
      Add custom tools
      Swap AI model

mindmap root((browser-agent-template)) What it does Browse real web Live browser panel Streaming chat UI Components Next.js frontend Vercel eve agent Browser Use cloud Setup One-click Vercel deploy Browser Use API key AI model credential Customization Rename agent Add custom tools Swap AI model

Click or tap to explore — scroll the page freely

What do people build with it?

USE CASE 1

Deploy a personal web research agent that can browse the web, scrape pages, and fill forms in response to natural language instructions

USE CASE 2

Build a customer-facing agent that answers questions by browsing your own website or documentation pages in real time

USE CASE 3

Use this as a base to add custom tools and skills to a web-browsing AI agent without building the chat UI or browser infrastructure from scratch

USE CASE 4

Create a demo or prototype of an AI agent that visually shows its browser activity to the user

What is it built with?

TypeScriptNext.jsReactNode.jsVercelAI SDK

How does it compare?

	browser-use/browser-agent-template	avijit07x/git-switch	ellian-eorwyn/hephaestus
Stars	56	54	53
Language	TypeScript	TypeScript	TypeScript
Setup difficulty	moderate	moderate	easy
Complexity	2/5	4/5	2/5
Audience	vibe coder	developer	vibe coder

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · moderate Time to first run · 30min

Requires a Browser Use API key from browser-use.com and an AI model credential, Node.js 24+ for local development.

MIT license -- use, modify, and redistribute freely including for commercial purposes.

So what is it?

Browser Agent Template is a ready-to-deploy starting point for building your own AI agent that can browse the real web on your behalf. You fork the repository, customize it, and deploy it to Vercel. Once running, you chat with the agent in a web interface, give it tasks involving web browsing, and watch a live panel showing the actual browser as the agent navigates, clicks, fills forms, and reads pages. The project combines three components into a single Next.js web application. The chat interface lets you type instructions and see the agent's responses streaming in, alongside a live view of what the browser is doing. The agent itself is powered by a framework called Vercel eve, which handles durable task sessions. The actual browser is a real cloud browser provided by the Browser Use service, not a scraping API or page simulation. When you give the agent a web task, it spins up a Browser Use cloud browser, receives a live stream URL for that session, and drives the browser using a low-level browser automation protocol. The side panel in the UI embeds that live URL so you can watch what the agent sees in real time. When the task ends, the session is closed. Your Browser Use API key stays on the server and is never exposed to the AI model or the browser client. Deployment can be done with a single click to Vercel using the button in the README. You need a Browser Use API key and an AI model credential. For local development, Node.js version 24 or newer is required along with the same two keys. The README includes a customization guide covering renaming the agent, swapping the AI model, adding tools and skills, and configuring the cloud browser with options like proxy country and custom user profiles. The project is MIT licensed.

Copy-paste prompts

Prompt 1

Fork and deploy browser-agent-template to Vercel. Walk me through setting the BROWSER_USE_API_KEY and AI_GATEWAY_API_KEY environment variables and verifying the deployment works

Prompt 2

I want to add a custom tool to this browser agent that saves scraped pages to a Postgres database. Show me where to register tools in the eve agent configuration

Prompt 3

How does the live browser side panel work in browser-agent-template? What is the liveUrl, how is it created, and how does the UI embed it?

Prompt 4

I want to change the AI model this browser agent uses. Which file controls the model choice and what values can I set?

Frequently asked questions