An ASMR mechanical-keyboard typing playground for the browser. Type to a wall of real switch sounds while the keys light up beneath your fingers, then run a speed test and watch your WPM climb. The whole experience is built around the satisfying thock and clack of mechanical keyboards, paired with calm, gradient visuals for an ASMR feel.
Live demo: klickityy-self.vercel.app
- Typing test (the landing view): timed 15 / 30 / 60 / 120s plus custom durations, optional punctuation and numbers modes, a smoothly gliding caret with line-by-line scrolling, word-skip on space, and live WPM/accuracy.
- Results: WPM, accuracy, consistency, raw, and errors, a per-second WPM graph, and share actions (copy a result link, copy a text summary, or download a vibrant PNG card).
- Real switch sounds: recorded samples for 13 switches, with per-keystroke pitch/gain/pan variation, a synthesized "case resonance" layer, and a soft error blip, so fast typing sounds organic rather than machine-gunned.
- Simulator: a large, sculpted, scale-to-fit keyboard (ANSI 60% / ISO 60% / 40% ortho) with distinct colorways; click keys or type to hear them.
- History: local-only stats and charts (WPM over time with a rolling average, accuracy over time, average WPM by duration, and a plain-language improvement insight).
- Setup side panel: switch, layout, colorway, volume/mute, and a share-setup link, opened from the header or with ⌘K / Ctrl+K.
- Light/dark themes, responsive, keyboard-accessible, and
prefers-reduced-motionaware.
| Live test | Results |
|---|---|
 |
 |
| Simulator | History & charts |
|---|---|
 |
 |
- Tab: restart the test (also Enter after a finished run)
- Space: skip to the next word
- ⌘K / Ctrl+K: toggle the Setup panel · Esc: close it
- React + TypeScript + Vite
- Web Audio API for low-latency sample playback
- Poppins on an original "Aurora" gradient design system
- No backend; everything runs and persists locally in the browser
npm install
npm run dev # http://localhost:5173
npm run build # type-check + production build
npm run preview # preview the production buildSwitch sound samples in public/sounds/ come from the kbsim project (MIT). See public/sounds/NOTICE.md for the required notice. The UI, layouts, colorways, and design system are original.