Keycode Info

Free online tool. All processing is client-side. No signup needed.

How to Use the Keycode Info

1. Enter your input values above
2. Results update automatically
3. Copy or download the output

What is a Keycode Info?

A Keycode Info tool displays the JavaScript event key codes, key names, and modifier states for any key you press — essential for web developers implementing keyboard shortcuts, game controls, accessibility features, and form input handling. Different browsers and keyboard layouts can produce different key codes, and the modern KeyboardEvent API (which replaced the deprecated keyCode) uses key names ('Enter', 'Escape', 'ArrowUp') instead of numeric codes. This tool shows both systems so you know what values to handle.

How Does It Work?

Press any key or key combination on your keyboard. The tool displays: (1) event.key — the modern property ('a', 'Enter', 'Shift'), (2) event.code — the physical key location ('KeyA', 'Enter', 'ShiftLeft'), (3) event.keyCode — the deprecated numeric code (65, 13, 16), (4) modifier states: ctrlKey, shiftKey, altKey, metaKey (Cmd on Mac). It also detects key combinations (Ctrl+S, Cmd+K) and shows the composite shortcut string.

Formula

KeyboardEvent Properties:\n\nevent.key (modern, RECOMMENDED):\n• 'a', 'A' (case reflects shift)\n• 'Enter', 'Escape', 'Backspace', 'Tab', ' '\n• 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'\n• 'Shift', 'Control', 'Alt', 'Meta' (Cmd/Win)\n• 'F1'-'F12', 'Home', 'End', 'PageUp', 'PageDown'\n\nevent.code (physical key, layout-independent):\n• 'KeyA', 'Digit1', 'Space', 'Enter'\n• 'ArrowUp', 'ShiftLeft', 'ShiftRight'\n• Unaffected by keyboard layout (QWERTY vs AZERTY vs Dvorak)\n\nevent.keyCode (deprecated, avoid in new code):\n• 65 = 'A', 13 = 'Enter', 27 = 'Escape', 32 = 'Space'\n• 37-40 = Arrows, 48-57 = Digits, 65-90 = Letters\n\nModifier Properties: event.ctrlKey, event.shiftKey, event.altKey, event.metaKey\n\nCommon Shortcut Patterns:\nCtrl+S (save), Ctrl+Z (undo), Ctrl+C (copy)\nCmd+K (command palette on Mac), Cmd+Shift+P (VS Code)

Who Uses This Tool?

• Web developers implementing custom keyboard shortcuts
• Game developers coding keyboard controls and key bindings
• Accessibility engineers testing keyboard navigation and screen readers
• Internationalization: testing keyboard layouts (US, UK, German, French, etc.)
• Power users creating keyboard shortcut cheat sheets

Pro Tips

• Use event.key for character-based shortcuts and event.code for position-based ones. event.key changes with keyboard layout; event.code doesn't
• For shortcuts: use event.ctrlKey (not event.key === 'Control') to check modifiers. This catches both left and right modifier keys
• On macOS, Cmd key combinations use event.metaKey. Common convention: use Ctrl on Windows/Linux, Cmd on Mac. Handle both for cross-platform
• Prevent default browser actions for your shortcuts: event.preventDefault(). Without this, Ctrl+S opens the browser's save dialog instead of your app's save

Frequently Asked Questions about Keycode Info

Why is keyCode deprecated?

KeyCode was inconsistent across keyboard layouts — pressing 'A' on an AZERTY keyboard gives a different keyCode than on QWERTY. event.key and event.code provide more predictable, layout-aware behavior. All modern browsers (2017+) support event.key.

How do I handle Ctrl/Cmd shortcuts cross-platform?

Check for both: const isMod = event.ctrlKey || event.metaKey. This catches Ctrl on Windows/Linux and Cmd on Mac. For known shortcuts like 'Save', use: if (isMod && event.key === 's') { save(); event.preventDefault(); }.

Free online Keycode Info — no signup, 100% client-side processing. All data stays in your browser.