Français

<kbd>

Show a key or keyboard shortcut

  • HTML
  • accessibility
  • semantics

<kbd> — The keyboard key

The <kbd> element represents keyboard input: a key, a shortcut, or any input the user must type. It differs from <code>, which represents source code.

When to use it

You want to indicate a keyboard shortcut, a key combination, or a command to type. For example: press Ctrl+S to save.

What you gain

Accessibility: screen readers do not treat <kbd> differently from regular text. The visual rendering (monospace, border) remains the only signal for sighted users. The value is in the markup: a tool knows this is a key, not a word.

Code example

<p>
  Press <kbd><kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>I</kbd></kbd>
  to open the developer tools.
</p>

Further reading