Examples
Filter by APIs
Filter by Permissions
Filter by Packages
Active Tab Content Script
Inject a content script only when clicking on the extension action.
Open →
Active Tab Screenshot
Use the activeTab permission to take a screenshot of the current tab
Open →
Background Message Forwarder
Forward messages from popup to active content scripts.
Open →
Basic Messaging
Send one-time messages or connect to long-lived ports.
Open →
Mount UI On Browser Action Click
Click on the extension to mount the UI on the web page.
Open →
Content Script Session Storage
Setup and use session storage in content scripts.
Open →
Devtools Extension
Create an extension that adds to the browser's devtools.
Open →
Dynamic Content Scripts
Use "webext-dynamic-content-scripts" and "webext-permission-toggle" to allow users to run content scripts on any page without requesting "*://*/*" on install.
Open →
ESM Content Script UI
Pre-bundle a content script as ESM with code-splitting enabled, dynamically import it from a content script, and load a UI with scoped CSS.
Open →
Favicon Tracker
Track and save favicons for all the websites you've been to.
Open →
Get Started Page
Open a unlisted HTML page when the extension is installed.
Open →
Inject Script
Inject a script into a webpage.
Open →
Parse DOM in an Offscreen Document
Use the DOMParser API in an offscreen document to process HTML snippets in the background.
Open →
Basic Offscreen Document Setup
Basic setup for using an offscreen document
Open →
Playwright E2e Testing
Setup end-to-end tests for an extension.
Open →
React Content Script UI
Basic example of using createShadowRootUi with React.
Open →
React Mantine
Add mantine to HTML pages and content scripts
Open →
Storybook
Integrate Storybook with WXT to develop components.
Open →
Svelte Custom Store
A custom svelte store wrapper around WXT's storage to enable clean subscriptions in Svelte (and TS) as well as persisting state.
Open →
TailwindCSS
Add TailwindCSS to your extension.
Open →
Vanilla I18n
Use the vanilla browser.i18n APIs to localize your extension.
Open →
Vitest Unit Testing
Setup unit tests and mock the browser APIs.
Open →
Vue Overlay
Show a simple overlay in the top right corner of every website.
Open →
Vue Storage Composable
Create a composable for managing a value in storage.
Open →
Web Worker Setup
Show how to create web workers using Vite's built-in support.
Open →
WXT I18n
Use @wxt-dev/i18n to localize your extension.
Open →