Skip to main content

​
Installation

HotkeyPad can be installed via your favorite package manager or loaded directly from a CDN.

​
Package managers

Install HotkeyPad using npm, yarn, or pnpm: 
npm install hotkeypad
HotkeyPad has zero dependencies, so this is all you need to install.

​
CDN

You can also use HotkeyPad directly from a CDN without any build step: 
<script type="module">
  import HotKeyPad from 'https://unpkg.com/hotkeypad?module'
  const hotkeypad = new HotKeyPad()
</script>
Using the CDN is perfect for prototyping or adding HotkeyPad to static sites without a build process.

​
Importing in your project

Once installed, import HotkeyPad and its CSS into your JavaScript or TypeScript file: 
import HotKeyPad from 'hotkeypad'
import 'hotkeypad/index.css'
You must import the CSS file for HotkeyPad to display correctly. The CSS includes all default styles and variables.

​
Requirements

HotkeyPad works in all modern browsers that support:
  • ES6 modules
  • Custom events
  • MutationObserver API
  • CSS variables
Internet Explorer is not supported. HotkeyPad requires a modern browser environment.

​
Verify installation

To verify that HotkeyPad is installed correctly, try importing it: 
import HotKeyPad from 'hotkeypad'

console.log(HotKeyPad) // Should output the HotKeyPad class

​
Next steps

Now that you have HotkeyPad installed, let’s build your first keyboard shortcut interface.

Quickstart

Create a working keyboard shortcut in under 5 minutes

Build docs developers (and LLMs) love

Get started for freeTalk to us