Web
Keycode Info
Inspect a keyboard event while distinguishing the typed key, physical code, modifiers, and legacy keyCode.
About this tool
When to use it
Inspect a keyboard event while distinguishing the typed key, physical code, modifiers, and legacy keyCode.
How to use it
Focus the capture area and press a key. Compare key with code when debugging keyboard layouts, then use Tab to leave the area. Test the actual target device because operating-system shortcuts may never reach the page.
Guide updated . Examples checked against this implementation.
Worked examples
A simple desktop key fixture
Input
Press lowercase a on a US-layout keyboardExpected output
key: a; code: KeyA; repeat: falseThis is a controlled layout example. The same physical position can produce another key on a different layout; keyCode is included only as legacy information.
Errors and unsupported input
A browser or OS shortcut is not capturedTry a nonreserved key. System shortcuts may be intercepted before JavaScript receives an event.
Continue this workflow
- Device Information: Record the browser environment associated with an input issue.
Questions
Frequently asked questions
Which value should a shortcut use?
Choose based on whether the shortcut follows the character meaning or a physical key position, then test alternative layouts and accessibility needs.