JavaScript Keycode Info

Press any key to inspect its JavaScript KeyboardEvent properties in real time.

Click here or press any key
—
waiting for key…
Ctrl Alt Shift Meta ⌘ Repeat
event.key —
event.code —
event.keyCode (deprecated) —
event.which (deprecated) —
event.location —
event.charCode (deprecated) —

Last 10 key presses. Switch to Live tab and press keys to populate.

No keys pressed yet.

Common keyboard codes for quick reference.

Key Name event.key event.code keyCode Category
Press any key to see its event properties.

How to Use the JavaScript Keycode Info Tool

  1. Click the capture zone or simply focus the page, then press any key on your keyboard.
  2. Read the properties — the large display shows the key character, and the grid shows every KeyboardEvent property.
  3. Switch to History to see your last 10 key presses side by side, useful for comparing similar keys.
  4. Use Reference to browse a quick lookup table of common key codes without pressing keys.
  5. Copy JSON to export the full event object for pasting into documentation or code.

Understanding JavaScript Keyboard Events

When a user presses a key in the browser, JavaScript fires three events in sequence: keydown, keypress (deprecated), and keyup. Each event carries a KeyboardEvent object containing a wealth of information about which key was pressed and what modifier keys were active at that moment. Understanding these properties is essential for building keyboard-driven applications, games, accessibility tools, and custom shortcuts.

event.key vs event.code

The most important distinction in modern keyboard handling is between event.key and event.code. The key property returns the logical, layout-aware value: pressing the "A" key on a QWERTY keyboard while holding Shift gives key = "A", while without Shift it gives key = "a". On an AZERTY keyboard, the same physical key returns key = "Q". The code property, by contrast, always returns the physical key identifier: code = "KeyA" regardless of layout or modifier keys. Use key for text input and code for hotkeys and game controls where physical position matters.

The Deprecated keyCode and which Properties

Before key and code were standardized, developers used event.keyCode and event.which to detect keypresses. These numeric properties still work in all browsers for backward compatibility, but they are deprecated in the Web Platform specification and should not be used in new code. They have browser inconsistencies (especially for non-alphanumeric keys), no concept of layout, and no way to distinguish left from right modifier keys. This tool displays them with a yellow warning to remind you they are legacy APIs.

event.location: Left, Right, and Numpad

Some keys appear in multiple positions on a keyboard — Shift, Ctrl, Alt appear on both sides, and digits appear both on the top row and the numeric keypad. The event.location property disambiguates these: 0 = standard (single position), 1 = left side, 2 = right side, 3 = numeric keypad. This lets you detect, for example, whether the user pressed the numpad Enter (location 3) or the main Enter (location 0), or whether they are using the left Ctrl versus the right Ctrl.

Modifier Keys: ctrlKey, altKey, shiftKey, metaKey

Every KeyboardEvent includes four boolean properties indicating whether modifier keys were held when the event fired. ctrlKey corresponds to the Ctrl key on Windows/Linux and the Control key on macOS. altKey is Alt on Windows/Linux and Option (⌥) on macOS. shiftKey is Shift on all platforms. metaKey is the Windows key on Windows/Linux and the Command key (⌘) on macOS. These are commonly combined in shortcut detection: if (e.ctrlKey && e.key === 's') { save(); }.

event.repeat: Handling Key Hold

When a key is held down, the browser fires repeated keydown events after an initial delay. The first event has repeat = false; all subsequent events from holding that key have repeat = true. This is important for keyboard shortcuts where you want to respond only once per keypress, not once per keyboard-repeat cycle. Simply check if (e.repeat) return; at the top of your handler to ignore hold-repeats.

Keys That Cannot Be Detected

Some keys are intercepted before JavaScript ever sees them. The OS captures Print Screen, most Windows key combinations (Win+D, Win+L), and hardware function keys on laptops. Browsers also block certain combos to protect users: Ctrl+W (close tab), Ctrl+T (new tab), Ctrl+N (new window), and the browser's built-in keyboard shortcuts. In fullscreen mode (via the Fullscreen API), slightly more keys become accessible, but OS-level keys remain unreachable.

Practical Use Cases

  • Keyboard shortcuts — detect Ctrl+S, Ctrl+Z, Escape, and arrow keys for rich text editors and applications
  • Games — use event.code (layout-independent) for WASD movement controls
  • Accessibility — ensure interactive widgets respond to Enter, Space, and arrow keys per ARIA patterns
  • Custom inputs — prevent default behavior for specific keys (e.g., blocking Enter in a single-line field)
  • Debug hotkeys — understand exactly what key values a user's browser reports for unusual characters

Frequently Asked Questions

event.key returns the logical value of the key, accounting for your keyboard layout and modifier keys — so Shift+A gives "A" and A alone gives "a". event.code returns the physical key position identifier regardless of layout — "KeyA" no matter what. Use event.key for text input and event.code for layout-independent shortcuts and game controls.
Yes. event.keyCode and event.which are deprecated in the web platform specification. They still work in all browsers for backward compatibility, but new code should use event.key (for the character value) and event.code (for the physical key). The deprecated properties have inconsistencies across browsers and no way to tell left from right modifier keys.
event.location distinguishes keys that appear in multiple places on the keyboard. Location 0 = standard position, 1 = left side (e.g., left Shift), 2 = right side (e.g., right Alt), 3 = numeric keypad. This lets you tell left Ctrl from right Ctrl, or tell numpad Enter from the main Enter key.
event.repeat is a boolean that is true when a key is held down and the browser's key-repeat fires subsequent keydown events. The first keydown has repeat = false; all following auto-repeat events have repeat = true. Add "if (e.repeat) return;" to ignore held-key repetitions in shortcuts and game loops.
Some keys are intercepted by the operating system or the browser before the page ever sees them. PrintScreen, Win key combinations (Win+D, Win+L), and hardware Fn shortcuts are handled at the OS level. Browsers also block common combos (Ctrl+W, Ctrl+T) to prevent pages from trapping navigation keys. What you can detect depends on the browser, OS, and whether the page is in fullscreen mode.