Keyboard Key Code Finder
Find the JavaScript key codes of any keyboard key online. Click the capture area and press a key to instantly see its key value, code value, numeric keyCode and the state of the Ctrl, Shift, Alt and Meta modifiers.
FreeOnline Tool
Loading…
How to Use
- Click the key detection area on the page so that it receives focus (the border highlights when it is active)
- Press any key on your keyboard, optionally while holding Ctrl, Shift, Alt or Meta
- The key, code, keyCode and the state of each modifier for that event are shown immediately below
- Keep pressing different keys; each press replaces the previous result with the latest key event information
Features
- Captures key down events in real time and shows the standard event.key value (the character or meaning of the key)
- Shows event.code, the physical key position identifier, which is unaffected by keyboard layout or input method
- Shows the deprecated but still widely used numeric event.keyCode value
- Shows the pressed state of the four modifiers: Ctrl, Shift, Alt and Meta (the Windows or Command key)
- Prevents the default action of the key press so browser shortcuts are not triggered accidentally
Use Cases
Debugging keyboard events in front-end code
Look up the exact key, code and keyCode values you need when implementing keyboard shortcuts instead of guessing or digging through documentation.
Checking behavior across keyboard layouts
Compare whether the same physical key reports a consistent event.code under different layouts or input methods when tracking down shortcut issues.
Checking whether a key still responds
If you suspect a key is faulty or misfiring, press it here and see whether the browser receives the corresponding keyboard event at all.
Learning the keyboard event API
Beginners can press keys and see for themselves how key, code and keyCode differ and how modifier states are exposed.
FAQ
What is the difference between key and code?
event.key is the character or meaning the key produces and changes with keyboard layout and modifiers (Shift+1 may give "!"). event.code identifies the physical key position (for example "Digit1") and stays the same regardless of layout or modifiers, so the two serve different purposes.
Why show keyCode if it is deprecated?
keyCode is indeed a legacy property that W3C has deprecated, but plenty of existing code and third-party libraries still rely on it. Showing it alongside the modern values makes migration and compatibility troubleshooting easier.
Nothing happens when I press a key, what is wrong?
You need to click the detection area first so it has focus, which is indicated by the highlighted border. Key events are not captured while the focus is somewhere else on the page.
What happens when I hold several modifiers at once?
Ctrl, Shift, Alt and Meta are detected independently, so holding a combination such as Ctrl+Shift shows all of the corresponding modifiers as pressed at the same time.