Welcome to Arlopass
import Callout from "../../../components/docs/Callout.astro"; Arlopass lets users bring their own AI provider to any web app. Instead of locking into a single model or forcing users to trust you with API keys, your app connects to whatever provider the user already has — through a browser extension that acts as a universal AI wallet. ## How it works The architecture has three layers: - **The Arlopass browser extension** holds the user's provider credentials and exposes a secure transport on the page. - **The Web SDK** (`@arlopass/web-sdk`) connects to that transport and gives you a client for sending messages, streaming responses, and calling tools. - **The React SDK** (`@arlopass/react`) wraps the Web SDK in hooks and components so you can build AI-powered UIs with minimal boilerplate. ## Key features | Feature | Description | | ---------------------- | ---------------------------------------------------------------------------------------------------------- | | **Provider Agnostic** | Connect to OpenAI, Anthropic, Google, Ollama, or any provider your users choose. One API, every model. | | **Secure by Default** | API keys never touch your servers. The browser extension manages credentials, so you ship zero secrets. | | **Developer Friendly** | Full TypeScript support, React hooks, streaming out of the box, and guard components for common UI states. | ## Choose your path **Web SDK** — Framework-agnostic. Use with vanilla JS, Svelte, Vue, or any framework. Full control over every call. [Get started with the Web SDK →](/docs/getting-started/quickstart-web-sdk) **React SDK** — Hooks, providers, and guard components. The fastest way to add AI to a React app. [Get started with the React SDK →](/docs/getting-started/quickstart-react) <Callout type="tip" title="New to Arlopass?"> Start with the Installation guide to set up the extension and SDK, then follow the quickstart for your framework. </Callout>Arlopass lets users bring their own AI provider to any web app. Instead of locking into a single model or forcing users to trust you with API keys, your app connects to whatever provider the user already has — through a browser extension that acts as a universal AI wallet.
How it works
The architecture has three layers:
- The Arlopass browser extension holds the user’s provider credentials and exposes a secure transport on the page.
- The Web SDK (
@arlopass/web-sdk) connects to that transport and gives you a client for sending messages, streaming responses, and calling tools. - The React SDK (
@arlopass/react) wraps the Web SDK in hooks and components so you can build AI-powered UIs with minimal boilerplate.
Key features
| Feature | Description |
|---|---|
| Provider Agnostic | Connect to OpenAI, Anthropic, Google, Ollama, or any provider your users choose. One API, every model. |
| Secure by Default | API keys never touch your servers. The browser extension manages credentials, so you ship zero secrets. |
| Developer Friendly | Full TypeScript support, React hooks, streaming out of the box, and guard components for common UI states. |
Choose your path
Web SDK — Framework-agnostic. Use with vanilla JS, Svelte, Vue, or any framework. Full control over every call. Get started with the Web SDK →
React SDK — Hooks, providers, and guard components. The fastest way to add AI to a React app. Get started with the React SDK →