AI-AGENT

This project builds upon the foundation of the browser-use, which is designed to make websites accessible for AI agents.

We would like to officially thank WarmShao for his contribution to this project.

WebUI: is built on Gradio and supports most of browser-use functionalities. This UI is designed to be user-friendly and enables easy interaction with the browser agent.

Expanded LLM Support: We've integrated support for various Large Language Models (LLMs), including: Google, OpenAI, Azure OpenAI, Anthropic, DeepSeek, Ollama etc. And we plan to add support for even more models in the future.

Custom Browser Support: You can use your own browser with our tool, eliminating the need to re-login to sites or deal with other authentication challenges. This feature also supports high-definition screen recording.

Persistent Browser Sessions: You can choose to keep the browser window open between AI tasks, allowing you to see the complete history and state of AI interactions.

Your browser does not support playing this video!

Installation Guide

Prerequisites

• Python 3.11 or higher
• Git (for cloning the repository)

Option 1: Local Installation

Read the quickstart guide or follow the steps below to get started.

Step 1: Clone the Repository

git clone https://github.com/browser-use/web-ui.git
cd web-ui

Step 2: Set Up Python Environment

We recommend using uv for managing the Python environment.

Using uv (recommended):

uv venv --python 3.11

Activate the virtual environment:

• Windows (Command Prompt):

.venv\Scripts\activate

• Windows (PowerShell):

.\.venv\Scripts\Activate.ps1

• macOS/Linux:

source .venv/bin/activate

Step 3: Install Dependencies

Install Python packages:

uv pip install -r requirements.txt

Install Playwright:

playwright install

Step 4: Configure Environment

1. Create a copy of the example environment file:

• Windows (Command Prompt):

copy .env.example .env

• macOS/Linux/Windows (PowerShell):

cp .env.example .env

2. Open .env in your preferred text editor and add your API keys and other settings

Option 2: Docker Installation

Prerequisites

• Docker and Docker Compose installed
  • Docker Desktop (For Windows/macOS)
  • Docker Engine and Docker Compose (For Linux)

Installation Steps

1. Clone the repository:

git clone https://github.com/browser-use/web-ui.git
cd web-ui

2. Create and configure environment file:

• Windows (Command Prompt):

copy .env.example .env

• macOS/Linux/Windows (PowerShell):

cp .env.example .env

Edit .env with your preferred text editor and add your API keys

3. Run with Docker:

# Build and start the container with default settings (browser closes after AI tasks)
docker compose up --build

# Or run with persistent browser (browser stays open between AI tasks)
CHROME_PERSISTENT_SESSION=true docker compose up --build

4. Access the Application:

• Web Interface: Open http://localhost:7788 in your browser
• VNC Viewer (for watching browser interactions): Open http://localhost:6080/vnc.html
  • Default VNC password: "youvncpassword"
  • Can be changed by setting VNC_PASSWORD in your .env file

Usage

Local Setup

1. Run the WebUI: After completing the installation steps above, start the application:

   python webui.py --ip 127.0.0.1 --port 7788
   

2. WebUI options:
   • --ip: The IP address to bind the WebUI to. Default is 127.0.0.1.
   • --port: The port to bind the WebUI to. Default is 7788.
   • --theme: The theme for the user interface. Default is Ocean.
     • Default: The standard theme with a balanced design.
     • Soft: A gentle, muted color scheme for a relaxed viewing experience.
     • Monochrome: A grayscale theme with minimal color for simplicity and focus.
     • Glass: A sleek, semi-transparent design for a modern appearance.
     • Origin: A classic, retro-inspired theme for a nostalgic feel.
     • Citrus: A vibrant, citrus-inspired palette with bright and fresh colors.
     • Ocean (default): A blue, ocean-inspired theme providing a calming effect.
   • --dark-mode: Enables dark mode for the user interface.
3. Access the WebUI: Open your web browser and navigate to http://127.0.0.1:7788.
4. Using Your Own Browser(Optional):
   • Set CHROME_PATH to the executable path of your browser and CHROME_USER_DATA to the user data directory of your browser. Leave CHROME_USER_DATA empty if you want to use local user data.
     • Windows

        CHROME_PATH="C:\Program Files\Google\Chrome\Application\chrome.exe"
        CHROME_USER_DATA="C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data"
       

       Note: Replace YourUsername with your actual Windows username for Windows systems.

     • Mac

        CHROME_PATH="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
        CHROME_USER_DATA="/Users/YourUsername/Library/Application Support/Google/Chrome"
       

   • Close all Chrome windows
   • Open the WebUI in a non-Chrome browser, such as Firefox or Edge. This is important because the persistent browser context will use the Chrome data when running the agent.
   • Check the "Use Own Browser" option within the Browser Settings.

Docker Setup

1. Environment Variables:

   • All configuration is done through the .env file
   • Available environment variables:

     # LLM API Keys
     OPENAI_API_KEY=your_key_here
     ANTHROPIC_API_KEY=your_key_here
     GOOGLE_API_KEY=your_key_here
     
     # Browser Settings
     CHROME_PERSISTENT_SESSION=true   # Set to true to keep browser open between AI tasks
     RESOLUTION=1920x1080x24         # Custom resolution format: WIDTHxHEIGHTxDEPTH
     RESOLUTION_WIDTH=1920           # Custom width in pixels
     RESOLUTION_HEIGHT=1080          # Custom height in pixels
     
     # VNC Settings
     VNC_PASSWORD=your_vnc_password  # Optional, defaults to "vncpassword"
     

2. Platform Support:

   • Supports both AMD64 and ARM64 architectures
   • For ARM64 systems (e.g., Apple Silicon Macs), the container will automatically use the appropriate image

3. Browser Persistence Modes:

   • Default Mode (CHROME_PERSISTENT_SESSION=false):

     • Browser opens and closes with each AI task
     • Clean state for each interaction
     • Lower resource usage

   • Persistent Mode (CHROME_PERSISTENT_SESSION=true):

     • Browser stays open between AI tasks
     • Maintains history and state
     • Allows viewing previous AI interactions
     • Set in .env file or via environment variable when starting container

4. Viewing Browser Interactions:

   • Access the noVNC viewer at http://localhost:6080/vnc.html
   • Enter the VNC password (default: "vncpassword" or what you set in VNC_PASSWORD)
   • Direct VNC access available on port 5900 (mapped to container port 5901)
   • You can now see all browser interactions in real-time

5. Container Management:

   # Start with persistent browser
   CHROME_PERSISTENT_SESSION=true docker compose up -d
   
   # Start with default mode (browser closes after tasks)
   docker compose up -d
   
   # View logs
   docker compose logs -f
   
   # Stop the container
   docker compose down
   

Changelog

• 2025/01/26: Thanks to @vvincent1234. Now browser-use-webui can combine with DeepSeek-r1 to engage in deep thinking!
• 2025/01/10: Thanks to @casistack. Now we have Docker Setup option and also Support keep browser open between tasks.Video tutorial demo.
• 2025/01/06: Thanks to @richard-devbot. A New and Well-Designed WebUI is released. Video tutorial demo.