Keycode Info
Press any key on your keyboard to see its JavaScript keycode, key name, code, and location. Essential for debugging keyboard event handlers.
JavaScript Keycode Finder
Press any key on your keyboard to get its JavaScript event keycode.
All processing happens locally in your browser — nothing is stored or sent to any server.
How to Use the Keycode Finder
- Click anywhere inside the page to activate keyboard listening.
- Press any key on your keyboard.
- View the event.keyCode, event.key, event.code, and event.location values displayed instantly.
About JavaScript Keyboard Events
JavaScript's KeyboardEvent fires on keydown, keyup, and keypress (deprecated). Each event exposes several properties that describe which key was pressed. The three most important are: event.key (the character value), event.code (the physical key identifier), and event.keyCode (a legacy numeric code).
For keyboard shortcut implementations, event.code is the correct modern choice because it is layout-independent. A user with a German keyboard pressing the key that produces "z" on a US layout would give event.code = "KeyY" (because that's the physical position), but event.key = "z". Using event.code for shortcuts ensures they work regardless of the user's language settings.
This tool works by listening to keydown events on the page and immediately displaying all KeyboardEvent properties. It is useful for debugging event handlers, building keyboard navigation, or just looking up what code a key produces. Everything runs locally — nothing is recorded or transmitted.
Frequently Asked Questions
What is the difference between event.key and event.code? ▼
event.key returns the character value of a key (e.g. "a", "A", "Enter", "ArrowLeft"). event.code returns the physical key identifier (e.g. "KeyA", "Enter", "ArrowLeft"), regardless of keyboard layout. For shortcuts, event.code is more reliable because it does not change when users switch languages.
Why is event.keyCode deprecated? ▼
event.keyCode was deprecated because it handles international keyboard layouts inconsistently — the same physical key on a US layout vs. a German layout returns different numeric codes. The modern replacements event.key and event.code are more predictable.
Does this work with function keys? ▼
Yes. Press F1–F12, arrow keys (ArrowUp, ArrowDown, ArrowLeft, ArrowRight), modifier keys (Shift, Control, Alt, Meta), Tab, Escape, and most media keys to see their codes.
What does event.location mean? ▼
event.location distinguishes between multiple copies of the same key. 0 = standard, 1 = left side, 2 = right side, 3 = numeric keypad. This lets you detect whether a user pressed the left or right Shift key, for example.
What is the keyCode for the spacebar? ▼
The spacebar has keyCode 32, event.key " " (a space character), and event.code "Space". Press it in the tool to see all properties instantly.
How do I prevent default behavior for a key? ▼
In your JavaScript handler, call event.preventDefault() to stop the browser's default action (like scrolling with the spacebar). Use event.code to identify keys layout-independently: if (event.code === "Space") event.preventDefault().
What is the Enter key code? ▼
Enter has keyCode 13, event.key "Enter", and event.code "Enter". NumpadEnter has the same key value but event.code "NumpadEnter", letting you distinguish between the two.