Content CSS Modules

Injects a small styled badge into every web page you visit.

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

Create this project

npx extension@latest create my-content-css-modules --template content-css-modules
cd my-content-css-modules
npm install
npm run dev

What it is for

  • A content script styled with CSS modules
  • Class names hashed so page styles never collide
  • Starting point for content scripts that need scoped CSS

First steps

  • Run npm run dev to launch the extension
  • Open any web page to see the badge this template injects
  • Edit src/content/styles.module.css and save to restyle the badge

Permissions it asks for

  • <all_urls>

Source on GitHubDocumentation

extension.devDocumentation for extension.dev