Back to Marketplace
Open Source

keyboard.js

The tiny keyboard library. keyboard.js ships hotkeys, key sequences (g g), chords (j+k), stackable named scopes, layout remap (Dvorak/Colemak), and a record + replay engine — everything a web app will ever need from the keyboard — in 3.2KB gzipped with zero runtime dependencies. TypeScript-first, MIT licensed.

TypeScriptRollupHotkeysKey SequencesChordsNamed ScopesLayout RemapRecord & ReplayCommand PaletteZero DependenciesOpen SourceMIT License
Visit Live Site

The Problem

Challenge

Every web app needs keyboard shortcuts, but the existing options force a trade-off: hotkeys-js is tiny but can't do sequences or chords, Mousetrap handles sequences but not chords or stackable scopes, and neither offers layout remapping or macro recording. When a product matures — command palettes, Vim-style navigation, modal scopes, Dvorak users, QA replay — teams end up writing fragile custom code on top of raw keydown listeners. There was no single library that covered the full keyboard story while staying small, typed, and framework-agnostic.

Our Approach

Strategy

We built keyboard.js from scratch in TypeScript with a singleton API (`Kb`) that unifies every pattern under one mental model. Hotkeys resolve modifiers cross-platform (`mod` → Cmd on Mac, Ctrl on Windows/Linux). Sequences track inter-key timing with a configurable window. Chords detect simultaneous keydowns. Named scopes stack and can be marked exclusive to suppress globals while modals are open. Layout remap translates physical keys through Dvorak/Colemak/QWERTY tables. The recorder captures frame-accurate key timelines and replays them at arbitrary speed — ideal for macros, tests, and onboarding tours. The landing page is a self-hosting showcase: a live keyboard visualizer that lights up pressed keys, interactive cards demonstrating each binding type, a fully playable Snake game, a Vim-style command palette, a Konami easter egg, and a recorder demo.

The Solution

Result

A production-ready, MIT-licensed keyboard library at 3.2KB gzipped with zero runtime dependencies. Ships UMD for one-tag CDN usage and ESM + full TypeScript declarations for bundlers. Six core capabilities (hotkeys, sequences, chords, scopes, layouts, recorder) behind a consistent `Kb.on / Kb.chord / Kb.pushScope / Kb.record` API. Deployed on Vercel at keyboardjs.techzunction.com with a documentation site that doubles as a live playground — every feature runs in the browser against real keypresses.

Screenshots

Product Gallery

keyboard.js hero — live keyboard visualizer with v1.0.0 · 3.2KB gzip · 0 dependencies · TypeScript-first · MIT license badges and Try the Live Demo CTA
keyboard.js stats grid — 3.2 KB gzipped, 0 runtime deps, 6 core features, keys-pressed counter with full QWERTY keyboard visualization
Try it — press any binding: hotkey (⌘+K), chord (j+k), sequence (g g), hotkey (Shift+?), sequence (g h), hotkey (Esc) with live fire counters
Scopes — stackable named scopes (global / editor / modal) with bindings that only fire in their active scope (⌘+S editor, Enter modal)
keyboard.js Snake game — built entirely with the library, Space to start/pause, WASD/arrows to move, plus Konami code easter egg and Vim-style command palette

Live Demos

See It in Action

Full Walkthrough

Key Metrics

0.2KB

Gzipped

0

Dependencies

0

Core Features

MIT

License

Get This Product

keyboard.js

Complete source code, assets, and deployment-ready build

$10USD / one-time

Exclusive Ownership

Secure payment via Razorpay. Instant delivery.

Next Product

mousepad.js

View Product

keyboard.js

$10