HTML <kbd> Tag Tutorial - Usage, Syntax,
Attributes and Example

calender-iconPublished: 11 May 2025

clock-icon5-min read

printer-icon whatsapp-icon share-icon



close-button
HTML
Table of Contents

INTRODUCTION

The <kbd> element is used to specify that the user should give some specific input generally through keyboard. User can input from a keyboard, voice input, or any other text entry device. By default the browser will show the text in default monospace font.

The <kbd> element is useful for documenting keyboard shortcuts, command-line instructions, or anywhere you want to visually indicate that the user should press a specific key. This element is used with <samp> element to represent various kinds of input or output instructions.

Display: By default the browser will show the text in default monospace font.

Syntax: 
<kbd> -- text -- </kbd>


Example: 
<p> To save the document, press <kbd>ctrl</kbd> + <kbd>s</kbd></p>


Output:

To save the document, press ctrl + s



ATTRIBUTES

The <kbd> element only has global attributes.



Tag Omission

The HTML <kbd> element must have both start tag and end tag.

Frequently Asked Questions(FAQ)

What are the differences between kbd, samp and code in HTML ?
In HTML, <kbd>, <samp> , and <code> are all inline elements which display text in monospace font, but they serve different purposes:
  • <kbd> - Represents keyboard input from the user..
  • <samp> - Represents system or program output.
  • <code> - Used to display code snippets.

What is the use of the KBD tag in HTML? ?
The kbd element is used to specify that the user should give some specific input generally through keyboard. It is useful for documenting keyboard shortcuts, command-line instructions, or anywhere you want to visually indicate that the user should press a specific key.