Frontend & Web API Studio

JavaScript KeyCode Inspector

Press any key on your keyboard to instantly inspect JavaScript KeyboardEvent parameters, modifiers, physical codes, and event listener snippets.

Live Keystroke Capture Active
32
Key: Space
ShiftCtrlAlt / OptionMeta / Cmd / Win
Event Properties
event.key"Space"
event.code"Space"
event.keyCode (Legacy)32
event.which (Legacy)32
event.locationStandard (0)
Recent Keystrokes:
Code Snippet Generator
Vanilla JavaScript
window.addEventListener('keydown', (event) => {
  if (event.code === 'Space') {
    console.log('Key pressed:', event.key);
  }
});
React useEffect Hook
useEffect(() => {
  const handleKeyDown = (event) => {
    if (event.code === 'Space') {
      console.log('Action triggered by Space');
    }
  };
  window.addEventListener('keydown', handleKeyDown);
  return () => window.removeEventListener('keydown', handleKeyDown);
}, []);
JavaScript KeyCode Reference Table
Key Nameevent.keyevent.codekeyCodeCategory
Backspace"Backspace"Backspace8Control
Tab"Tab"Tab9Control
Enter"Enter"Enter13Control
Shift"Shift"ShiftLeft16Modifier
Control"Control"ControlLeft17Modifier
Alt / Option"Alt / Option"AltLeft18Modifier
Pause / Break"Pause / Break"Pause19Control
Caps Lock"Caps Lock"CapsLock20Modifier
Escape"Escape"Escape27Control
Spacebar"Spacebar"Space32Control
Page Up"Page Up"PageUp33Navigation
Page Down"Page Down"PageDown34Navigation
End"End"End35Navigation
Home"Home"Home36Navigation
Arrow Left"Arrow Left"ArrowLeft37Arrow
Arrow Up"Arrow Up"ArrowUp38Arrow
Arrow Right"Arrow Right"ArrowRight39Arrow
Arrow Down"Arrow Down"ArrowDown40Arrow
Insert"Insert"Insert45Control
Delete"Delete"Delete46Control
0"0"Digit048Number
1"1"Digit149Number
2"2"Digit250Number
3"3"Digit351Number
4"4"Digit452Number
5"5"Digit553Number
6"6"Digit654Number
7"7"Digit755Number
8"8"Digit856Number
9"9"Digit957Number
A"A"KeyA65Letter
B"B"KeyB66Letter
C"C"KeyC67Letter
D"D"KeyD68Letter
E"E"KeyE69Letter
F"F"KeyF70Letter
G"G"KeyG71Letter
H"H"KeyH72Letter
I"I"KeyI73Letter
J"J"KeyJ74Letter
K"K"KeyK75Letter
L"L"KeyL76Letter
M"M"KeyM77Letter
N"N"KeyN78Letter
O"O"KeyO79Letter
P"P"KeyP80Letter
Q"Q"KeyQ81Letter
R"R"KeyR82Letter
S"S"KeyS83Letter
T"T"KeyT84Letter
U"U"KeyU85Letter
V"V"KeyV86Letter
W"W"KeyW87Letter
X"X"KeyX88Letter
Y"Y"KeyY89Letter
Z"Z"KeyZ90Letter
F1"F1"F1112Function
F2"F2"F2113Function
F3"F3"F3114Function
F4"F4"F4115Function
F5"F5"F5116Function
F6"F6"F6117Function
F7"F7"F7118Function
F8"F8"F8119Function
F9"F9"F9120Function
F10"F10"F10121Function
F11"F11"F11122Function
F12"F12"F12123Function

About this tool

Comprehensive documentation & audit utility guide
Verified Utility

JavaScript KeyboardEvent objects contain comprehensive metadata about user input, including the modern standard event.key, physical layout identifier event.code, and legacy numeric keyCode / which values. This inspector captures keystrokes in real-time and generates listener boilerplate.

How it works
1
Press Any Key

Hit any physical key, modifier combo, or function key on your keyboard.

2
Inspect Event Object

View event.key, event.code, numeric keyCode, location index, and modifier booleans.

3
Copy Snippet

Grab boilerplate event listener code for Vanilla JS or React useEffect hooks in one click.

Key Features & Capabilities
Real-time event capture for event.key, event.code, keyCode, which, and charCode
Live modifier key detection (Shift, Ctrl, Alt/Option, Meta/Command/Windows)
Key location detection (Standard 0, Left 1, Right 2, Numpad 3)
Searchable database covering standard alphanumeric, function (F1-F12), navigation, and control keys