JavaScript Keycode Finder

KeyboardEvent Properties Explained

When you press a key in a browser, JavaScript fires a KeyboardEvent with multiple properties describing what happened. Each property answers a different question:

• event.key — the logical character produced ("A", "a", "Enter", "ArrowUp", "$"). Reflects keyboard layout and modifier state. Shift+a = "A". Use this for character-based logic (text input, single-char shortcuts).
• event.code — the physical key position ("KeyA", "Enter", "ArrowUp", "Digit1"). Independent of layout — Shift+a still gives "KeyA". Use this for game controls, layout-independent shortcuts (WASD movement, Ctrl+Z based on physical Z key).
• event.keyCode (deprecated) — legacy numeric code (65 for A, 13 for Enter). Inconsistent across browsers. Use only for IE/legacy support; otherwise prefer key or code.
• event.which (deprecated) — same as keyCode, even older.
• event.location — distinguishes left vs right Shift/Ctrl/Alt (0=standard, 1=left, 2=right, 3=numpad).
• event.repeat — true when key is held down (repeated keydown events).
• event.shiftKey / ctrlKey / altKey / metaKey — modifier states. metaKey = Cmd on Mac, Win key on Windows.
• event.isComposing — true during IME (Input Method Editor) composition. Important for CJK input.

key vs code: Which to Use

Common Special Key Values

Common Keyboard Shortcut Patterns

// Single key
if (event.key === "Escape") closeModal()

// Combo: Ctrl+S (Cmd+S on Mac)
if ((event.ctrlKey || event.metaKey) && event.key === "s") {
  event.preventDefault()
  save()
}

// Modifier-aware: only Shift+Tab (not Ctrl+Shift+Tab)
if (event.key === "Tab" && event.shiftKey && !event.ctrlKey) {
  navigateBackward()
}

// Layout-independent (game): WASD
const moves = { KeyW: "up", KeyA: "left", KeyS: "down", KeyD: "right" }
const direction = moves[event.code]
if (direction) movePlayer(direction)

// Number row vs numpad
if (event.code.startsWith("Digit")) handleTopRowNumber()
if (event.code.startsWith("Numpad")) handleNumpadNumber()

Browser Compatibility Gotchas

• Mac Command vs Windows Ctrl: use event.metaKey || event.ctrlKey for "modifier+key" shortcuts that should work on both platforms
• IE / legacy: only event.keyCode works pre-IE9. Modern code can ignore IE.
• Safari quirks: some keys fire only keydown / keyup, never keypress. Prefer keydown for shortcuts.
• Dead keys (`, ´, ^): on French/German layouts, fire keydown without producing a character — event.key = "Dead".
• IME composition: CJK input fires keydown for each composition step; check event.isComposing to filter.
• preventDefault for browser shortcuts: Ctrl+T (new tab), Ctrl+W (close tab) can't be prevented — browser intercepts before JS.
• Mobile keyboards: Android software keyboards often fire keydown with key === "Unidentified". Use input event for mobile-compatible text capture.