OneTaskBy Tim King · Updated
JavaScript Keycode
event.key, event.code and keyCode Values for Any Key Press, With Modifier State
OneTask is free, with no sign-up, and built by one person.
If this tool saved you time, a coffee helps keep new ones coming.
How the Keycode Tester works
This JavaScript keycode tool shows every property of a key event. Press any key and see precisely what the browser hands your keydown handler: event.key,
event.code, the deprecated keyCode, the key's physical location, which modifiers were held and
whether the key is repeating. The last ten presses stay in a table so you can compare them.
JavaScript keycode: key, code and keyCode
Keyboard events look simple until you write a shortcut that works on your machine and silently fails on someone else's layout. The reason is that a single keypress carries two different identities, and choosing the wrong one is the source of nearly every keyboard bug.
event.key is the character produced; event.code is the physical key. Press the key to the
right of Tab on a QWERTY keyboard and key is "q" while code is "KeyQ". On a French AZERTY
layout the same physical key produces "a" — key changes, code does not. Hold Shift and key
becomes "Q", while code stays "KeyQ". So use key when you care what the user typed, and
code when you care where their finger is, as in a WASD game control scheme.
keyCode is deprecated and has been for years. It is still populated by every browser and it
still appears in every tutorial, which is why it survives. But its values were never fully
standardised, it conflates Shift states, and it reports the same number for keys that produce
different characters on non-US layouts. It remains in the specification only as a legacy field.
There is no situation in new code where keyCode is the right choice — key or code covers every
case.
Modifier keys fire their own events. Pressing Ctrl+S produces two keydown events: one where
key is "Control", then one where key is "s" and ctrlKey is true. Code that assumes a
single event per shortcut will see the bare modifier first. Check e.ctrlKey, e.metaKey,
e.altKey and e.shiftKey on the event for the key you actually care about, and remember that
Ctrl on Windows and Linux corresponds to Meta — the Command key — on a Mac.
Some shortcuts never reach your page at all. The operating system and the browser claim keys
first: Cmd+Q quits, Ctrl+W closes the tab, F11 goes full screen, and several function keys are
intercepted by the hardware before any software sees them. preventDefault() cannot reclaim those,
so avoid binding application behaviour to them. Anything Ctrl+ or Cmd+ that collides with a browser
shortcut will frustrate users even when it technically works.
Not every text input arrives as a keydown. Dead keys for accented characters, IME composition
for Chinese, Japanese and Korean, autofill, pasting and dictation all change an input's value
without a matching keystroke. If you are validating or reacting to what someone typed, listen for
input rather than keydown; reserve keydown for shortcuts and navigation.
FAQ
What is the keycode for Enter?
event.key is "Enter" and event.code is "Enter", or "NumpadEnter" on the numeric keypad.
The legacy keyCode is 13. Compare against e.key === 'Enter' — it reads clearly and works across
layouts.
Should I use event.key or event.code?
Use event.key for anything about the character typed, including text shortcuts, and event.code
for anything about physical position, such as game movement keys. Using code for a letter-based
shortcut breaks it on every non-QWERTY layout.
Why does nothing happen when I press a key?
Click inside the page first so it has focus. Some combinations are also captured by the operating
system or the browser before the page can see them — Cmd+Q and Ctrl+W among them — and never fire a
keydown event here.
What does event.location tell me?
Which of several physically identical keys was pressed: 0 for standard, 1 for the left-hand modifier, 2 for the right-hand one and 3 for the numeric keypad. It is how you distinguish left Shift from right Shift.
Is my typing recorded anywhere?
No. Every keypress is read and displayed by JavaScript running in this page, and nothing is stored or sent anywhere. Closing the tab discards the history table.
See also: all Dev Utilities tools, Formatters & Validators, Data & Encoding, Security & Identifiers, SEO, Accessibility, AI.
Related tools
ASCII Table
All 128 ASCII codes in decimal, hex, octal and binary.
CHMOD Calculator
Convert Unix permissions between rwx, octal and symbolic.
CSS Selector Tester
Test a CSS selector against pasted HTML and list every matching element.
Core Web Vitals Calculator
Check whether your page passes Core Web Vitals and which metric to fix first.
DNS Lookup
Query any DNS record for a domain with TTLs and explanations.