Find Any Key Code

What Is a Key Code Finder?

A key code finder is a tool that shows you the exact JavaScript event properties generated when you press any key on your keyboard. Press a key and it instantly displays the values for event.key, event.code, keyCode, charCode, and which, all in one place.

Developers need these values when building keyboard shortcuts, game controls, form validation, or any feature that responds to keyboard input. Instead of guessing a key's code or searching through documentation tables, you press the key and get the exact values your code needs.

Our key code finder also detects modifier key states like Shift, Ctrl, Alt, Cmd, CapsLock, and NumLock, so you can check how key combinations behave, not just individual keys.

How to Use the Key Code Finder

1. Step 1: Press Any Key

   Click on the tool area and press the key you want to look up. The event properties appear instantly on screen.

2. Step 2: Read the Values

   You'll see an event.key, event.code, keyCode, charCode, and which for the key you pressed. Each value is displayed separately, so you can grab exactly the one you need.

3. Step 3: Check Modifier States

   If you need to test a key combination, hold down Shift, Ctrl, Alt, or Cmd while pressing the key. The tool shows which modifiers were active during the press.

4. Step 4: Copy and Use

   Pick the value that fits your use case and drop it into your code. Use event.key or event.code for modern projects. Fall back to keyCode only if you're supporting older browsers.

event.key vs event.code vs keyCode: What's the Difference?

These three properties all come from the same keyboard event, but they return different things and are meant for different situations.

Quick rule: use event.key when you care about what character was typed, event.code when you care about which physical key was pressed, and keyCode only when maintaining old code.

Common Key Codes Reference Table

A quick lookup for the keys developers search for most often.

This covers the keys that developers look up most often. For any key not listed here, just press it in the tool above and get the values instantly.

How to Handle Keyboard Events in JavaScript

There are three keyboard events in JavaScript: keydown fires when a key is pressed, keyup fires when it's released, and keypress fires for character-producing keys. keypress is deprecated, so stick with keydown and keyup for all new code.

Here's a basic setup using an event.key:

document.addEventListener("keydown", (event) => {
  if (event.key === "Enter") {
    // handle Enter key
  }
});

If you're building something where physical key position matters, like game controls, use an event.code instead:

document.addEventListener("keydown", (event) => {
  if (event.code === "KeyW") {
    // move forward, works on any keyboard layout
  }
});

To detect key combinations, check the modifier properties along with the key:

document.addEventListener("keydown", (event) => {
  if (event.ctrlKey && event.key === "s") {
    event.preventDefault();
    // custom save action
  }
});

One thing to watch out for: always call the event.preventDefault() when overriding browser shortcuts like Ctrl+S or Ctrl+P. Without it, the browser's default action fires alongside your custom handler.

Frequently Asked Questions