⌨️ Typpa

Practice typing on the internet you already read.

Select text on any webpage and type right over it — in the page's own font. Plus a full practice popup, local stats with keyboard heatmaps, and five themes.

Free forever · No account · No ads · Nothing leaves your device

Install · How to use · Features · Privacy · Say hi

---

✨ What is Typpa?

Every typing tutor makes you practice random words inside its app. Typpa flips that: the article, documentation, or Wikipedia page you're already reading becomes the typing test. Select the text, press a shortcut, and each letter dims then lights back up as you type it — right there in the page. When you're done, the page returns to normal as if nothing happened.

It's also a complete typing trainer in its own right, with timed tests, quotes, custom text, difficulty modes, and a stats dashboard that shows you exactly which keys you fumble.

🚀 Install

Browser stores (links go live as each review completes):

Browser	Status
Chrome	Coming soon
Edge	Coming soon
Brave	Coming soon (uses the Chrome listing)
Firefox	Coming soon

From source (works today):

1. Download this repo — Code → Download ZIP — and unzip it (or git clone https://github.com/alnahian2003/typpa).
2. Chrome / Edge / Brave: open chrome://extensions (or edge://extensions), turn on Developer mode, click Load unpacked, and pick the unzipped folder.
3. Firefox: open about:debugging#/runtime/this-firefox, click Load Temporary Add-on, and pick manifest.json inside the folder.
4. Pin Typpa to your toolbar. Done — no build step, no dependencies.

🎯 How to use

Type over any webpage (the headline feature)

1. Select some text on any site.
2. Press Alt+K, or right-click → "Practice typing this text with Typpa", or click the toolbar icon and hit "Type it".
3. Type. Correct letters return to full color, mistakes turn red, a floating pill shows your live WPM.
4. Press Esc anytime to stop — the page is restored exactly.

Prefer a clean window instead of typing over the page? Click ⧉ Window in the floating pill, or set Settings → Selected-text practice → Floating window as your default.

Quick practice from the popup

Click the Typpa icon (or press Alt+T) and pick a mode:

Mode	What it is
time 15s / 30s / 60s	Type as much as you can before the clock runs out
words 10 / 25 / 50	Race through a fixed number of common words
quote	A random famous quote, attributed
custom	Paste anything — code, lyrics, that email you keep rewriting

Keyboard shortcuts

Keys	Action
Alt+K	Practice the current page selection
Alt+T	Open the popup
Tab	Restart the current test
Enter	Continue at a line break (you'll see a ↵ marker)
Ctrl+Backspace	Delete the whole word
Esc	Close / exit

(Customize these at chrome://extensions/shortcuts.)

🧰 Features

• Three practice surfaces — in-place over any page, a floating window, and the popup — all sharing one typing engine.
• Stats dashboard — WPM & accuracy trends, daily streaks, personal bests per mode, full history, and a keyboard heatmap that shows which keys you actually miss. Open it from the popup or the extension's options.
• Difficulty modes — Normal (backspace freely), Expert (one wrong word ends the test), Master (one wrong keystroke ends it).
• Layout emulation — practice Dvorak or Colemak on your physical QWERTY keyboard.
• Five themes — forest (default), dark, light, ocean, rose. All free, all WCAG 2.2 AA contrast-checked.
• Thoughtful details — smart handling of curly quotes/em-dashes/footnote markers so real web text is typeable, ↵ markers at line breaks, plain-language tooltips on every stat, friendly feedback that adapts to your run, optional error sound (off by default), reduced-motion support, keyboard-first navigation.
• Data controls — export your full history as JSON, or wipe everything, from the dashboard.

🔒 Privacy

Typpa is private by architecture, not by policy:

• No server exists. There is nothing to send data to.
• Settings and statistics are stored locally via your browser's extension storage (settings sync through your own browser profile if you're signed in — that's your browser, not us).
• No analytics, no telemetry, no ads, no account.

Permissions, explained

Permission	Why Typpa needs it
storage	Save your settings and typing history on your device
contextMenus	The right-click "Practice typing this text" item
activeTab	Read your current selection when you click the popup's "Type it"
Content script on all sites	So any page's selection can become a practice surface — it stays dormant until you start a session

🛠 For developers

No build step — vanilla ES modules, Manifest V3.

typpa/
├─ manifest.json          MV3 manifest (Chrome/Edge/Brave/Firefox)
├─ background.js          Service worker: context menu + shortcut wiring
├─ shared/                One engine, many surfaces
│  ├─ engine.js           Word-based typing state machine (pure, DOM-free)
│  ├─ renderer.js         Shared practice UI (word stream, caret, results)
│  ├─ storage.js          Settings + history + aggregates
│  ├─ theme.css           Design system (5 themes, WCAG AA)
│  └─ …words, quotes, layouts, sound, feedback
├─ popup/                 Toolbar popup (practice · settings · connect · help)
├─ content/               On-page practice
│  ├─ inplace.js          Type-over-the-page mode (DOM wrapped & restored)
│  └─ overlay.js          Floating-window mode
├─ page/                  Stats dashboard (charts & heatmap, hand-rolled SVG)
└─ icons/

Load it unpacked, edit, hit reload. The engine is fully testable in Node since it never touches the DOM.

💬 Feedback & contact

Typpa is built and cared for by one person — me, Al Nahian. Found a bug? Have an idea? Just want to share your WPM? I read everything:

LinkedIn · GitHub · X / Twitter · Facebook

…or open an issue.

📄 License

MIT © Al Nahian — free forever, in spirit and in license.