> ## Documentation Index
> Fetch the complete documentation index at: https://extension.js.org/llms.txt
> Use this file to discover all available pages before exploring further.

# Preact browser extension template

> Scaffold a Preact browser extension with the React-compatible API in a 3kB runtime, tuned for size-sensitive popups and content scripts.

<img src="https://mintcdn.com/extensionjs/VCnDd7fX2Nza24SE/images/examples/new-preact/screenshot.png?fit=max&auto=format&n=VCnDd7fX2Nza24SE&q=85&s=18990d53ac3f59de5128777b4b10a3a9" alt="Preact template preview" className="w-full rounded-xl border border-black/10 dark:border-white/10" width="2400" height="1800" data-path="images/examples/new-preact/screenshot.png" />

## Create the project

<CodeGroup>
  ```bash npm theme={null}
  npx extension@latest create my-extension --template=preact
  ```

  ```bash pnpm theme={null}
  pnpx extension@latest create my-extension --template=preact
  ```

  ```bash yarn theme={null}
  yarn dlx extension@latest create my-extension --template=preact
  ```

  ```bash bun theme={null}
  bunx extension@latest create my-extension --template=preact
  ```

  ```bash bun theme={null}
  bunx extension@latest create my-extension --template=preact
  ```
</CodeGroup>

## What you get

The same component model as React with a 3kB runtime, configured with the standard `preact/compat` aliasing so most React libraries keep working. A good fit when bundle size matters, especially for content scripts injected into other people's pages.

## Source

Browse the full source on GitHub: [extension-js/examples/preact](https://github.com/extension-js/examples/tree/main/examples/preact).
