<kbd>

Edit on GitHub

The <kbd> element emphasizes characters to look like keys on a keyboard.

Syntax

The <kbd> element has no attributes. Text is placed in between the opening and closing <kbd> tags and will render in the browser’s default monospace font. <kbd> can be nested but the result will be the same.

<kbd><!-- Text goes here --></kbd>

Example 1

Leaving out an external <kbd> wrapper element is value and will have no effect.

<p>You can copy text by pressing <kbd>CTRL</kbd>+<kbd>C</kbd>.</p>

Keyboard Tag Example 1

Example 2

However, nested <kbd> elements may be useful for certain stylesheet setups.

<!-- prettier-ignore -->
<p>You can paste text by pressing <kbd><kbd>CTRL</kbd>+<kbd>V</kbd></kbd>.</p>

Keyboard Tag Example 2

Contributors

Interested in helping build Docs? Read the Contribution Guide or share your thoughts in this feedback form.
Edit on GitHub

Learn HTML on Codecademy

Career path

Front-End Engineer

Front-end engineers work closely with designers to make websites beautiful, functional, and fast.
Includes 34 Courses
With Professional Certification
Beginner Friendly
131 Lessons
Free course

Learn HTML

Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.
Beginner Friendly
6 Lessons
Edit on GitHub

Contributors