{"slug": "build-new-features-using-built-in-ai-in-chrome", "title": "Build new features using built-in AI in Chrome", "summary": "Google announced at I/O 2026 that developers can now build AI-powered features directly into web applications using Chrome's built-in AI APIs, eliminating cloud costs and keeping user data on-device. The new capabilities include automatic headline and meta description generation, image alt-text creation, content rewriting, and real-time translation, all running locally on the user's device. Chrome partnered with Build Awesome to release a blog template demonstrating these features, with companies like Drupal, Yahoo! Japan, and Trip.com already using the technology in production.", "body_md": "Published: May 26, 2026\n\n*This post is a write-up of the talk given at Google I/O 2026 by Thomas Steiner.*\n\nImagine building a travel blog where the blog post editor doesn't just store the\ntext, but where it actively supports you when writing. Meet Maya and Ashok, the\ncreators of **trAIlblazers**. They use [built-in AI in\nChrome](/docs/ai/built-in). By running models directly on the user's device,\ndevelopers bypass expensive cloud costs and latency while keeping sensitive data\nlocal.\n\nWe've collaborated with Build Awesome (formerly known as Eleventy) to release a\n**blog template with all the AI features** listed in the talk.\n\n## Why built-in AI?\n\n**Cost-efficient:** No cloud inference cost, all computation happens on users' supporting devices.**Privacy first:** Sensitive data never leaves the browser.**Offline functionality:** Once the model is downloaded, AI features work without an internet connection.**Performance:** Hardware acceleration allows on-device models to rival (and sometimes beat) cloud speeds.**Hybrid inference:** Using polyfills and tools like**Firebase AI Logic**, you can fall back to the cloud on unsupported devices (like mobile) while staying native on desktop.\n\n## AI features for modern web apps\n\n### The Summarizer API\n\nThe trAIlblazers editor uses the [Summarizer API](/docs/ai/summarizer-api) to\ngenerate headlines and SEO-friendly meta descriptions automatically.\n\n**Example: Generate a headline**\n\n``` js\nconst blogPost = document.querySelector('.article-body').innerText;\nconst summarizer = await Summarizer.create({\n  type: 'headline',\n  sharedContext: 'Write headlines that make people want to read the blog post',\n});\n\nfor await (const chunk of summarizer.summarizeStreaming(blogPost)) {\n  headline.append(chunk);\n}\n```\n\n### The Prompt API (with structured output)\n\nNeed specific data? By using [ JSON Schema with the Prompt\nAPI](/docs/ai/structured-output-for-prompt-api), you can make the AI return\npredictable formats. The trAIlblazers team uses this for the following:\n\n**Tag Generation:** Suggest categories like \"Adventure\" or \"Beach\" from a predefined list.**Comment Moderation:** Classify comments as \"Safe\" or \"Harmful\" before they are published.\n\n### Media accessibility\n\nThe editor automates the \"hard parts\" of Markdown. When you drop an image, the\n[Prompt API (with multimodal\ninput)](https://developers.google.com/ml-kit/genai/prompt/android/get-started)\nanalyzes the pixels to generate accessible alt-text and informative captions.\n\n### Writing and rewriting\n\nWith the [ Writer](/docs/ai/writer-api) and\n\n[, users can expand bullet points into complete paragraphs and change the tone of a paragraph to be \"more casual\" or \"shorter\" with a single click.](/docs/ai/rewriter-api)\n\n**Rewriter APIs**### Seamless translation\n\nThe [ Translator API](/docs/ai/translator-api) allows creators to draft\ncontent in English and instantly translate it for Spanish or Japanese readers,\nwhich native speakers can then refine.\n\n## Real-world success stories\n\nMany partners are already shipping these APIs in production. Notable examples include the following:\n\n**Drupal:** Uses the Summarizer API for SEO tag generation within CKEditor.**Yahoo! Japan:** Uses the Prompt API for community comment moderation.**Trip.com:** Helps shoppers navigate complex flight booking options with AI overviews.\n\n## Resources from the talk\n\nReady to build your own \"trAIlblazers\" experience? Check out these resources:\n\n**Starter template:**[Build Awesome starter-extended-blog](https://github.com/GoogleChrome/starter-extended-blog)(Includes all AI features mentioned in the talk.)**Documentation:**[Built-in AI on Chrome for Developers](/docs/ai/built-in)** TypeScript support:**Installon npm.`@types/dom-chromium-ai`\n\n**Google I/O 2025 talk:**[Practical built-in AI with Gemini Nano in Chrome](https://www.youtube.com/watch?v=CjpZCWYrSxM)", "url": "https://wpnews.pro/news/build-new-features-using-built-in-ai-in-chrome", "canonical_source": "https://developer.chrome.com/blog/build-new-features-using-built-in-ai-in-chrome-io2026?hl=en", "published_at": "2026-05-26 07:00:00+00:00", "updated_at": "2026-05-26 12:08:31.546018+00:00", "lang": "en", "topics": ["artificial-intelligence", "machine-learning", "large-language-models", "generative-ai", "natural-language-processing"], "entities": ["Google", "Thomas Steiner", "Chrome", "Summarizer API", "Firebase AI Logic", "Eleventy", "Build Awesome", "trAIlblazers"], "alternates": {"html": "https://wpnews.pro/news/build-new-features-using-built-in-ai-in-chrome", "markdown": "https://wpnews.pro/news/build-new-features-using-built-in-ai-in-chrome.md", "text": "https://wpnews.pro/news/build-new-features-using-built-in-ai-in-chrome.txt", "jsonld": "https://wpnews.pro/news/build-new-features-using-built-in-ai-in-chrome.jsonld"}}