Skip to content
Lizely

JavaScript Key Code Finder

Press a real key and inspect its layout-aware key value, physical code, location, modifiers, repeat and composition flags, plus the deprecated keyCode.

Privacy: your files never leave your device. All processing happens locally in your browser.

How to use

  1. 1.Click or tab to the bordered capture area.
  2. 2.Press the key or combination you want to inspect.
  3. 3.Compare key for meaning with code for physical position, then review location and modifiers.
  4. 4.Copy the JSON only as a diagnostic and test the real target browsers and layouts.

About JavaScript Key Code Finder

JavaScript Key Code Finder captures a keydown event inside a deliberately focused test area and displays the browser values developers commonly need for shortcuts, games, accessibility controls, and input diagnostics. Press a letter, number, navigation key, modifier, function key, or numpad key to see key, code, location, active modifiers, repeat state, composition state, and the legacy numeric keyCode. Copy the displayed record as formatted JSON for a bug report or local test fixture. Nothing typed outside the capture area is observed.

The key and code fields answer different questions. key represents the meaning produced after the current keyboard layout and modifier state are applied. On a US layout, the same physical key may report 2 or @ depending on Shift. Other layouts can report a different character. code represents the physical key position, such as Digit2 or KeyW, and normally stays stable across layout changes. Use key when a shortcut should follow the character or named action. Use code when physical placement matters, as in WASD movement.

Location distinguishes standard, left, right, and numpad variants. This matters for Shift, Control, Alt, Meta, Enter, and numeric keys that can exist in more than one place. The modifier list reports the state included in the event, not a global history of everything pressed. repeat becomes true when the operating system or browser emits repeated keydown events while a key is held. composing indicates that an input method editor or dead-key composition may be producing text, so shortcut handlers should often avoid acting until composition is complete.

keyCode is shown only for compatibility diagnosis. UI Events does not define reliable modern values for it, and MDN marks it deprecated and implementation-dependent. Printable-key behavior has differed across browsers and layouts. New code should use key or code, with feature-specific tests. Do not infer ASCII, Unicode, or a typed character from keyCode. A value of zero does not necessarily mean that no key exists; it may mean the legacy property cannot identify it.

The capture area remains keyboard accessible. Tab is never canceled, so users can move focus away instead of becoming trapped. Other keys have their default action canceled only while the capture target is focused, which prevents Space or arrow keys from scrolling the page during inspection. Browser-reserved shortcuts, operating-system shortcuts, accessibility technology, password managers, remote desktops, and input methods can intercept events before a page receives them. Mobile virtual keyboards may expose fewer code values because no physical key position exists.

This tool does not record a history, listen globally, identify a keyboard model, fingerprint hardware, or upload event data. It holds only the latest event in React state until the page changes or reloads. Avoid typing passwords, recovery codes, or other secrets even though the value remains local; a keyboard diagnostic never needs confidential content. For automated tests, construct KeyboardEvent fixtures carefully because synthetic events are not trusted user input and may not reproduce native platform behavior.

Eight standard-derived fixtures cover letters, shifted digits, left and right Alt, numpad Enter, and dead-key composition, while four unique location labels are asserted independently. Real devices remain the final compatibility check. Test the exact layouts, operating systems, browsers, assistive technologies, and IMEs your feature supports. Provide an alternate clickable control for essential shortcuts, document conflicts, and never make a single physical keyboard layout the only way to complete a critical action.

Methodology & sources

Maps one focused keydown event into standard key, code, location, modifier, repeat, and composition fields, preserves keyCode only with a legacy warning, and never stores an event history or installs a global listener.

Frequently asked questions

What is the difference between key and code?
key reflects the current layout and modifiers; code identifies the physical key position and is usually layout-independent.
Should I use keyCode in new JavaScript?
No. It is deprecated and implementation-dependent. Prefer key or code according to whether meaning or physical placement matters.
Does the tool log everything I type?
No. It listens only while the visible capture area is focused and retains only the latest event locally.

Related tools

Developer Tools guides

View all