Every power-user app — GitHub, Figma, Linear, Notion — has a keyboard shortcut layer that reveals itself when you press ?. Building one from scratch means wiring up event listeners, handling modifier keys, managing sequences like g then h, grouping shortcuts by category, and building a UI on top of all that. So register hotkeys, display a beautiful overlay with ?, handle sequences, groups, and modifiers — in 5 lines.
I'm Ronak, and I built hotkey-hint after copy-pasting the same keyboard shortcut boilerplate into three different projects in one month.
Every power-user app — GitHub, Figma, Linear, Notion — has that moment where you press ? and a beautiful overlay appears showing all the shortcuts. But there was no lightweight, zero-dependency library that gave you that out of the box. You either bought into a full form library, rolled your own event listeners, or just... didn't add shortcuts at all.
So I built the thing I wanted to exist:
→ Register shortcuts with one line: hh.register({ keys: 'ctrl+k', description: 'Search', action })
→ Press ? anywhere — a polished overlay appears, grouped and labeled
→ Supports vim-style sequences like g then h
→ Dark / light / auto theme, zero dependencies, 1.8kB gzip
→ Works in React, Vue, Svelte, vanilla JS — no framework lock-in
Live demo at everythingfrontend.com/hotkey-hint — press ? on the page to see it in action. Takes about 30 seconds to feel what it does.
This is the first package in everythingfrontend — a collection of focused, zero-dependency frontend utilities. Each one solves exactly one problem, perfectly.
My question for the PH community: What frontend problem do you keep solving from scratch on every project? The next package in the collection will be shaped by your answers. 👇
Report
No reviews yetBe the first to leave a review for hotkey-hint