Chrome's Prompt API: Add Free, On-Device AI to Your Browser Extension

Your users want AI-powered features. Your competitors are shipping them. But wiring up OpenAI or Gemini Cloud means API costs, latency, privacy headaches, and rate limits that break at scale.

Chrome’s Prompt API changes everything. Starting in Chrome 138, you can run natural language prompts against Gemini Nano — directly on the user’s device. No API keys. No per-request billing. No data leaving the browser.

If you build Chrome extensions, this is the most important AI API you’ll use this year.

Why the Chrome Prompt API Matters for Extension Developers

Today, adding AI to an extension means:

• API costs that scale linearly with users
• Privacy risk — user text sent to external servers
• Network dependency — offline users get nothing
• Rate limits that throttle power users
• Latency — every request round-trips to the cloud

The Chrome Prompt API eliminates all five. Gemini Nano runs locally on the user’s machine. Your extension gets free, private, instant AI — no infrastructure required.

Hardware Requirements: What Your Users Need

Before building, know the minimum specs:

Pro tip: Always implement a graceful fallback for users whose hardware doesn’t meet requirements. A good extension works for everyone — AI just makes it better.

Quick Start: Your First AI Prompt in 3 Steps

1. Check Model Availability

const available = await LanguageModel.availability({
  expectedInputs: [{ type: "text", languages: ["en"] }],
  expectedOutputs: [{ type: "text", languages: ["en"] }],
});

if (available === "unavailable") {
  console.log("Gemini Nano not available on this device");
}

The availability() method returns one of four states:

2. Create a Session

const session = await LanguageModel.create();

3. Send a Prompt

const result = await session.prompt("Summarize this in one sentence: " + articleText);
console.log(result);

That’s it. Three steps. No credentials, no billing dashboard, no SDK to install.

Real Extension Use Cases

The Prompt API isn’t a toy. Here’s what you can build today:

AI-Powered Search Within Pages

Let users ask natural language questions about the current webpage:

const session = await LanguageModel.create({
  initialPrompts: [
    {
      role: "system",
      content: "You answer questions about the following webpage content.",
    },
    { role: "user", content: `Page content: ${document.body.innerText}` },
  ],
});

const answer = await session.prompt("What are the pricing tiers?");

Smart Content Classification

Automatically categorize content — news articles, emails, support tickets:

const session = await LanguageModel.create({
  initialPrompts: [
    {
      role: "system",
      content:
        "Classify text into exactly one category: Tech, Business, Sports, Entertainment, Science. Reply with only the category name.",
    },
  ],
});

const category = await session.prompt(articleText);

Contact Extraction

Pull names, emails, and phone numbers from any webpage:

const result = await session.prompt(
  "Extract all contact information (names, emails, phone numbers) from this text as JSON: " +
    selectedText
);

Content Filtering & Moderation

Screen user-generated content before it hits your backend:

const session = await LanguageModel.create({
  initialPrompts: [
    {
      role: "system",
      content:
        'You are a content moderator. Rate content as "safe", "warning", or "block". Reply with only the rating.',
    },
  ],
});

const rating = await session.prompt(userComment);

Streaming Responses for Better UX

For longer outputs, stream the response so users see results immediately:

const stream = session.promptStreaming("Write a detailed summary of: " + text);

for await (const chunk of stream) {
  outputElement.textContent = chunk;
}

Golden rule: Always use streaming for any prompt that might generate more than a sentence. Users waiting for a blank screen to suddenly fill with text will think your extension is broken.

Multimodal Input: Beyond Text

The Prompt API supports images and audio — not just text.

Analyze Images

const session = await LanguageModel.create({
  expectedInputs: [{ type: "image" }],
});

const image = document.querySelector("img");
const description = await session.prompt([
  { role: "user", content: [{ type: "image", image }, "Describe this image in detail."] },
]);

Supported image types: HTMLImageElement, HTMLCanvasElement, ImageBitmap, VideoFrame, Blob, and more.

Analyze Audio

const session = await LanguageModel.create({
  expectedInputs: [{ type: "audio" }],
});

const audioBuffer = await fetchAudioBuffer(audioUrl);
const transcript = await session.prompt([
  { role: "user", content: [{ type: "audio", audio: audioBuffer }, "Transcribe this audio."] },
]);

Session Management Best Practices

Each session has a context window — a limited amount of tokens it can track. Managing sessions well is the difference between a polished extension and a broken one.

Monitor Context Usage

console.log(`Used: ${session.inputUsage} / ${session.inputQuota} tokens`);

Handle Context Overflow

session.addEventListener("contextoverflow", () => {
  // Context is full — start a new session or summarize history
  console.warn("Session context exceeded. Creating fresh session.");
});

Clone Sessions to Save Resources

If you need multiple conversations from the same starting point, clone instead of recreating:

const baseSession = await LanguageModel.create({
  initialPrompts: [
    { role: "system", content: "You are a helpful writing assistant." },
  ],
});

const sessionA = await baseSession.clone();
const sessionB = await baseSession.clone();

Destroy Sessions When Done

session.destroy();

Always clean up. Each session consumes memory. Extensions that leak sessions will degrade browser performance — and earn bad reviews.

TypeScript Support

Install the type definitions:

npm install --save-dev @types/dom-chromium-ai

Then add to your tsconfig.json:

{
  "compilerOptions": {
    "types": ["dom-chromium-ai"]
  }
}

Full IntelliSense for LanguageModel, session.prompt(), and all related APIs.

The Graceful Fallback Pattern

Not every user will have Gemini Nano available. Here’s the pattern every production extension should follow:

async function smartPrompt(text) {
  const available = await LanguageModel.availability({
    expectedInputs: [{ type: "text" }],
  });

  if (available === "available") {
    const session = await LanguageModel.create();
    return await session.prompt(text);
  }

  if (available === "downloadable" || available === "downloading") {
    // Show user a "downloading AI model" indicator
    const session = await LanguageModel.create({
      monitor(m) {
        m.addEventListener("downloadprogress", (e) => {
          console.log(`Download: ${Math.round((e.loaded / e.total) * 100)}%`);
        });
      },
    });
    return await session.prompt(text);
  }

  // Fallback: cloud API, simpler heuristic, or disable feature
  return fallbackImplementation(text);
}

The 86% rule applies here. Most users decide within the first few minutes whether your extension is worth keeping. If AI features fail silently with no fallback, you’ve lost them.

Current Status & What’s Next

The Prompt API is in origin trial now, which means you can ship it to real users today — but the API surface may change before full stable release. Build with it, but keep your fallback patterns tight.

Key Takeaways

1. Zero cost, zero latency, zero privacy risk — Gemini Nano runs entirely on-device
2. Three lines of code to go from zero to AI-powered extension
3. Multimodal support — text, images, and audio input out of the box
4. Always implement fallbacks — not every device supports on-device AI yet
5. Stream long responses — never leave users staring at a loading spinner
6. Clean up sessions — memory leaks kill reviews

The Prompt API is the easiest path to shipping AI features in a Chrome extension. No billing, no backend, no excuses.

Ready to build? Try the Prompt API Playground and start experimenting today. And when your AI-powered extension is ready for the Chrome Web Store, AppBooster has the tools to help you launch, optimize, and grow.