Skip to main content
Version: 4.0


This hook allows you to record a hotkey stroke by the user. This is useful if you want the user to define their custom keystroke for your application.

Basic Usage

Import the useRecordHotkeys hook from the package:

import { useRecordHotkeys } from 'react-hotkeys-hook';

or if you are using require style syntax:

const { useRecordHotkeys } = require('react-hotkeys-hook')
// or
const useRecordHotkeys = require('react-hotkeys-hook').useRecordHotkeys

Record hotkeys

In order to record a hotkey, you need to call the useRecordHotkeys hook. This hook returns an array similar to the useState hook, but the second argument has some extra properties.

Live Editor

Note that the returned value of the recorded keys is a Set object. This is because every key gets recorded only once. Implementation wise it is easier to use a Set than an array, but you can convert it to an array if you want or need to, like we are in the example above.