QiLing Tools

🎹JavaScript Keycode Finder - Show event.key, event.code and keyCode for Any Key

Writing keyboard shortcuts, game controls or form interactions means knowing exactly what a key looks like in JavaScript. Open this page and press any key to see the combination in large type plus event.key, event.code, keyCode, which, location (left, right or numpad), repeat, isComposing and the Ctrl, Shift, Alt, Meta and CapsLock states. The US-layout on-screen keyboard highlights keys that are down and keys you have pressed, which also makes it a quick keyboard tester. A history table logs recent keydown (and optionally keyup) events, and an IME test field shows compositionstart / update / end events to explain keyCode 229 during Chinese or Japanese input. From the last key you can copy an addEventListener snippet that matches by key or by code. At the bottom is a searchable reference table of common keys with their key, code and keyCode. Note that keyCode and which are deprecated; new code should use key or code.

Free · No sign-up · Runs in your browserLast updated:

Loading tool...

How to use Keycode Finder

  1. 1Click an empty area so the page has focus, then press any key or shortcut
  2. 2Read event.key, code, keyCode and more while the on-screen keyboard lights up
  3. 3Copy the generated JavaScript condition, or search the reference table for other keys

FAQ

What is the difference between event.key, event.code and keyCode?
event.key is the character or function the key produces and changes with layout and Shift ("a", "A", "Enter"). event.code is the physical key position, independent of layout ("KeyA", "ShiftLeft"), which suits position-based controls such as WASD. keyCode is a legacy numeric code that is deprecated and inconsistent across browsers and layouts, so avoid it in new code.
Why are some keys or shortcuts not detected?
Shortcuts reserved by the browser or OS, such as Ctrl+W, Ctrl+T or Cmd+Q, are handled before the page sees them and cannot be intercepted. The Fn key usually produces no event, and some media keys depend on the system and browser. The page must also have focus; keys pressed while the address bar or another window is focused are not delivered.
Why is keyCode 229 during IME input?
While an input method is composing text, browsers report key "Process", keyCode 229 and isComposing true on keydown; the final text arrives in compositionend or input events. Shortcut handlers should check event.isComposing first so they do not fire while the user is picking characters, and the snippet generated here already does.
Can I use it to test whether my keyboard has dead keys?
Yes. The on-screen keyboard marks keys you have pressed in light blue and keys currently held in dark blue. Press every key once and any key that stays uncolored was not detected. You can also hold several keys at once to test rollover (how many simultaneous keys your keyboard reports).