nicetool.dev logo

Keycode Tester

Press any key on your keyboard. Nothing you type is stored or sent.

Press any key to see its codes

event.key vs event.code vs keyCode

Every key press in the browser fires a KeyboardEvent with several properties. event.key is the value the key produces, such as "a", "A", "Enter" or "ArrowUp", and it follows the user's keyboard layout and Shift state. event.code describes the physical key, such as "KeyA" or "Digit1", so it stays the same on QWERTY, AZERTY or Dvorak keyboards. keyCode and which are old numeric codes that are deprecated and inconsistent across browsers and layouts. Modern code should use event.key for text and shortcuts, and event.code when the position matters, like WASD controls in games.

Features

  • • Shows event.key, event.code, keyCode and event.location for any key
  • • Modifier state for Ctrl, Shift, Alt and Meta, plus key repeat
  • • Ready-to-copy JavaScript if statement for the pressed key
  • • History of the last keys pressed
  • • Prevents scrolling for Space and arrows while you test

Private by design

Key events are read only on this page, in your browser. Nothing you press is recorded or sent anywhere.

No keylogging, 100% client-side.

How to use the Keycode Tester

  1. 1

    Click anywhere on the page so it has focus, then press a key. On phones, tap the input to open the on-screen keyboard.

  2. 2

    Read the big value: event.key. Below it you get event.code and the legacy keyCode.

  3. 3

    Check the cards for the key location (left or right Shift, numpad) and which modifiers were held, then copy any value with one click.

  4. 4

    Copy the generated if statement into your keydown handler. The history shows the last keys so you can compare combinations.

Practical examples

Keyboard shortcuts

For Ctrl+K or Cmd+K search, press the combination and use event.key === "k" with event.ctrlKey || event.metaKey, which works on Windows and macOS.

Game controls

Use event.code ("KeyW", "KeyA", "KeyS", "KeyD") so movement keys stay in the same place on AZERTY and other layouts, where event.key would be "z" or "q".

Submitting on Enter

Check event.key === "Enter" and !event.shiftKey in a chat input to send on Enter and insert a new line with Shift+Enter.

Numpad and side-specific keys

Distinguish the numpad Enter (location 3) from the main Enter, or left and right Shift (location 1 and 2) when an app needs it.

Frequently asked questions

Should I use event.key or event.code?+

Use event.key for anything tied to the character, such as shortcuts with letters, text input or Escape and Enter. Use event.code when the physical position matters, such as games or layout-independent hotkeys.

Why is keyCode deprecated?+

keyCode values were never standardized: they differ between browsers, keyboard layouts and keydown versus keypress. The KeyboardEvent standard replaced them with key and code, which all modern browsers support.

Why does a mobile keyboard show "Unidentified" or 229?+

On-screen keyboards often send composition events instead of real key codes, especially with autocorrect or IME input. Listen to input or beforeinput events for text on mobile.

Why do some shortcuts not reach the page?+

The browser or operating system handles some combinations first, such as Ctrl+W, Ctrl+T, Cmd+Q or Alt+Tab, so a web page cannot capture or block them.