A browser extension that brings AI agent capabilities to web applications.
Harbor implements the Web Agent API — a proposed standard that exposes window.ai and window.agent to web pages, giving them access to AI models and tools with user consent.
The problem: Every website that wants AI features needs to either:
- Ask users for API keys (bad UX, privacy concerns)
- Pay for and manage their own AI infrastructure (expensive, data custody issues)
- Use cloud services that see all user data (privacy nightmare)
The vision: What if the browser could provide AI capabilities directly to web pages — like it provides fetch() for network access or localStorage for persistence?
With the Web Agent API:
- Users control their own AI (run local models, choose providers, manage permissions)
- Websites get AI capabilities without managing infrastructure or handling sensitive data
- Privacy is preserved because data can stay local
// Any website can use AI — no API keys, no backend needed
const session = await window.ai.createTextSession();
const response = await session.prompt("Summarize this page");→ Read the full explainer: Why Web Agents?
Just want to see it work? Get running in 5 minutes.
- Firefox 109+ or Chrome 120+
- Node.js 18+
- Rust (
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh) - Ollama for local AI (
brew install ollama && ollama serve && ollama pull llama3.2)
# Clone and build
git clone --recurse-submodules https://github.com/anthropics/harbor.git
cd harbor
cd extension && npm install && npm run build && cd ..
cd bridge-rs && cargo build --release && ./install.sh && cd ..
# Load extension
# Firefox: about:debugging → Load Temporary Add-on → extension/dist/manifest.json
# Chrome: chrome://extensions → Developer mode → Load unpacked → extension/dist/cd demo && npm install && npm startOpen http://localhost:8000 and try:
- Getting Started — Interactive tutorial
- Chat Demo — Full chat with tools
- Page Summarizer — One-click summaries
→ Full installation guide | More demos
Building a hackathon project or integrating AI into your web app?
The Web Agent API gives your web pages access to:
| API | What It Does |
|---|---|
window.ai.createTextSession() |
Chat with AI models |
window.agent.tools.list() |
List available MCP tools |
window.agent.tools.call() |
Execute tools (search, files, databases) |
window.agent.run() |
Run autonomous agent tasks |
window.agent.browser.activeTab.readability() |
Read page content |
<!DOCTYPE html>
<html>
<body>
<button id="ask">Ask AI</button>
<div id="output"></div>
<script>
document.getElementById('ask').onclick = async () => {
// 1. Request permission
await window.agent.requestPermissions({
scopes: ['model:prompt'],
reason: 'To answer your question'
});
// 2. Create session and prompt
const session = await window.ai.createTextSession();
const response = await session.prompt('What is 2+2?');
document.getElementById('output').textContent = response;
};
</script>
</body>
</html>| Document | Description |
|---|---|
| API Quickstart | Get from zero to working code in 15 minutes |
| Web Agents API Reference | Complete API docs with examples |
| JS API Reference | Detailed window.ai and window.agent reference |
| Working Examples | Copy-paste ready code |
| Demo Source Code | Full demo implementations |
Want your AI to do more? Create MCP servers that give it new capabilities:
# Copy the template and start building
cp -r mcp-servers/templates/javascript my-tool
cd my-tool && edit server.js| Document | Description |
|---|---|
| Tool Creation Quickstart | Build your first tool in 15 minutes |
| MCP Authoring Guide | Complete guide (JS and WASM) |
| Example: Gmail Integration | Real-world OAuth example |
Permissions: All capabilities require user consent. Request what you need:
await window.agent.requestPermissions({
scopes: ['model:prompt', 'mcp:tools.list', 'mcp:tools.call'],
reason: 'Enable AI features'
});Feature Flags: Some APIs are gated. Users enable them in the sidebar:
toolCalling— Enablesagent.run()for autonomous tasksbrowserInteraction— Enables click/fill/scroll automationbrowserControl— Enables tab management and navigation
Want to contribute to Harbor or build your own Web Agent API implementation?
┌─────────────────────────────────────────────────────────────────┐
│ WEB PAGE │
│ window.ai / window.agent (injected APIs) │
└───────────────────────────────┬─────────────────────────────────┘
│ postMessage
▼
┌─────────────────────────────────────────────────────────────────┐
│ BROWSER EXTENSION │
│ • Permission enforcement • In-browser WASM/JS MCP │
│ • Feature flags • Message routing │
└───────────────────────────────┬─────────────────────────────────┘
│ Native Messaging
▼
┌─────────────────────────────────────────────────────────────────┐
│ RUST BRIDGE │
│ • LLM provider abstraction • Native MCP servers │
│ • Ollama/OpenAI/Anthropic • OAuth flows │
└─────────────────────────────────────────────────────────────────┘
| Document | Description |
|---|---|
| Architecture | System design and component details |
| Contributing Guide | Build, test, and submit changes |
| MCP Host | MCP execution environment internals |
| Testing Plan | Test coverage and QA procedures |
# Watch mode
cd extension && npm run dev # Auto-rebuild on changes
cd bridge-rs && cargo build # Rebuild after Rust changes
# Test
cd bridge-rs && cargo test
cd extension && npm testHarbor is an implementation of the Web Agent API. The specification itself is browser-agnostic.
| Document | Description |
|---|---|
| Specification Overview | What the Web Agent API is and why it matters |
| Full Explainer | Complete spec with Web IDL and security model |
| Security & Privacy | Threat model and mitigations |
harbor/
├── spec/ # Web Agent API specification (browser-agnostic)
├── extension/ # Browser extension (TypeScript)
│ └── src/agents/ # window.ai / window.agent implementation
├── bridge-rs/ # Rust native messaging bridge
├── demo/ # Working examples
├── docs/ # Implementation documentation
├── mcp-servers/ # Built-in MCP servers (WASM, JS)
└── installer/ # macOS package builder
MIT