Join the Google Early Preview Program
Read this for details: https://github.com/explainers-by-googlers/prompt-api
This Next.js application demonstrates integration with Chrome's built-in AI capabilities using the experimental Prompt API. It provides a chat interface where users can interact with an AI model directly in their browser.
- Node.js (v14 or later)
- Google Chrome (version 127 or later, Canary or Dev channel recommended)
- At least 22 GB of free storage space
- GPU with at least 4 GB VRAM
- Non-metered internet connection
- Download Chrome Dev or Canary channel
- Ensure Chrome version is 128.0.6545.0 or newer
- Set Chrome flags:
- Navigate to
chrome://flags/#optimization-guide-on-device-model
- Set to "Enabled BypassPerfRequirement"
- Go to
chrome://flags/#prompt-api-for-gemini-nano
- Set to "Enabled"
- Relaunch Chrome
- Navigate to
- Open Chrome DevTools console
- Run:
await window.ai.canCreateTextSession();
- If it returns "readily", you're set
- If not, run:
await window.ai.createTextSession();
- Relaunch Chrome
- Go to
chrome://components
- Check if Optimization Guide On Device Model is present with version ≥ 2024.5.21.1031
- If not, click "Check for update"
- Clone the repository:
- Install dependencies:
npm install
- Start the development server:
npm run dev
- Open
http://localhost:3000
in your Chrome browser
AIStatus
: Displays the current status of the AI modelChatInterface
: Manages the chat session and message handlingChatArea
: Renders the chat messagesMessageInput
: Handles user input for sending messages
This project uses Tailwind CSS for styling. Custom styles can be added in app/globals.css
.
- This app uses an experimental API and is for demonstration purposes only
- The Prompt API is intended for local prototyping, not production use
- AI functionality may not work in Incognito or Guest mode
- The app currently only supports English (US) language
If you encounter issues:
- Verify Chrome flags are correctly set
- Ensure Gemini Nano is downloaded (check
chrome://components
) - Confirm your device meets the hardware requirements
- Try relaunching Chrome or clearing browser data
We welcome feedback and contributions. Please open an issue or submit a pull request on our GitHub repository.
MIT
This project is part of the Chrome Built-in AI Early Preview Program. For more information, please refer to the [https://forms.gle/DWYuEkLYePsFfCZ7A](official documentation).