Skip to main content
Back to the lab
Chrome extension

Piper TTS

Fully local read-aloud for Chrome

View source
ChromePiperLocal AI
Piper TTS popup with profile, speed, volume, test, and stop controls
Piper TTS options — voice profiles tab
Piper TTS options — voices tab
Piper TTS options — settings tab with fallback and shortcuts

The problem

Read-aloud tools are cloud-bound: subscriptions, API keys, and your reading habits shipped to someone else's server — just to hear a paragraph of text.

The build

Highlight text on any page, right-click, and it is read aloud by a Piper TTS model running entirely on your own machine. A browser-TTS fallback works instantly with zero setup, so the extension is useful before the local server is even installed. No cloud, no API keys, no data leaves your computer.

Stack & choices

  • Chrome MV3Service worker for the context menu plus an offscreen document for audio playback
  • ReactPopup and options UI — profiles, voices, settings, credits
  • Node.js + PiperLocal server wrapping the Piper neural TTS engine and its voice models
  • esbuildBundles the React UI into the extension

Process notes

  1. 1

    MV3 killed background audio, so playback runs in an offscreen document — one of those Chrome-platform quirks you only learn by hitting it.

  2. 2

    Voice profiles bundle voice, speed, and volume so switching between a fast skim-voice and a slow listen-voice is one click.

  3. 3

    Screenshots are generated by a Puppeteer script that runs from WSL but drives Windows Chrome — the same automation pattern shared with TubeVault.

  4. 4

    A git pre-commit hook keeps the built dist/ in sync with src/, so the loadable extension never drifts from the source.