How to use the JavaScript Keycode Finder
- Click the box (or anywhere on the page) and press a key or shortcut.
- Read
event.key,event.codeand the legacykeyCode. - Copy the generated
keydownhandler for your shortcut.
key, code and keyCode
| Property | What it tells you | Use it for |
|---|---|---|
event.key | The character or key name produced, respecting layout and Shift ("a", "A", "Enter") | Text input, “type ? for help” |
event.code | The physical key position, independent of layout ("KeyA", "Digit1") | Games (WASD) and position-based shortcuts |
event.keyCode / which | Legacy numeric codes (Enter = 13, Esc = 27) | Old code only — deprecated |
event.location | 0 standard, 1 left, 2 right, 3 numpad | Telling left/right Shift or numpad keys apart |
Common key codes
| Key | event.key | event.code | keyCode |
|---|---|---|---|
| Enter | Enter | Enter | 13 |
| Escape | Escape | Escape | 27 |
| Space | " " | Space | 32 |
| Tab | Tab | Tab | 9 |
| Backspace | Backspace | Backspace | 8 |
| Arrow keys | ArrowLeft/Up/Right/Down | same | 37–40 |
| A–Z | a–z / A–Z | KeyA–KeyZ | 65–90 |
| 0–9 | 0–9 | Digit0–Digit9 | 48–57 |
| F1–F12 | F1–F12 | F1–F12 | 112–123 |
Writing shortcut handlers
Check modifiers explicitly (e.ctrlKey || e.metaKey covers Ctrl on Windows and ⌘ on macOS), call e.preventDefault() only for shortcuts you handle, and skip your handler while the user types in inputs. Prefer key for letter shortcuts so they follow the user’s keyboard layout, and code when the physical position matters.
Test regular expressions for key handling in the regex tester, or check how the browser identifies itself with the user agent parser.
Tools that pair well with the JavaScript Keycode Finder
- Online HTML Editor — A lightweight code playground: edit HTML, CSS and JavaScript side by side, see the result instantly, read console output and download your page as one HTML file.
- JavaScript Formatter — Unminify and pretty-print JavaScript, JSON or JSX with your preferred indentation and brace style — or strip whitespace and comments with a verified minifier.
- What Is My Screen Resolution — Your screen and browser window sizes in CSS pixels, the device pixel ratio and the real physical resolution — measured live by your browser.
- HTML Formatter — Paste minified or messy markup and get clean, consistently indented HTML — including embedded <style> and <script> blocks.
Frequently asked questions
Should I use keyCode?
No.
keyCode and which are deprecated. Use event.key for the character and event.code for the physical key.What is the keycode for Enter?
Enter has keyCode 13,
key "Enter" and code "Enter" (or "NumpadEnter" on the numeric keypad).Why does Ctrl+W close the tab?
Some browser shortcuts cannot be intercepted by web pages for security reasons, including Ctrl+W, Ctrl+T and Ctrl+N in most browsers.