Sidebar shadcn

Adds a sidebar panel to the browser built with shadcn/ui components.

Runs on Chrome, Edge, Firefox · Manifest V3 · Surfaces: sidebar, content script, popup, background service worker · Styling: CSS · Level: beginner · Framework: react

Create this project

npx extension@latest create my-sidebar-shadcn --template sidebar-shadcn
cd my-sidebar-shadcn
npm install
npm run dev

What it is for

  • A sidebar built from shadcn/ui components
  • Tailwind and Radix primitives inside an extension surface
  • Starting point for extensions with a modern component kit

First steps

  • Run npm run dev to launch the extension
  • Click the extension icon to open the sidebar panel
  • Add a shadcn/ui component and save to see it in the panel

Permissions it asks for

  • sidePanel

Source on GitHubDocumentation

extension.devDocumentation for extension.dev