HTML kbd tag
HTML

HTML kbd tag

Editorial Team
Editorial Team

Follow us on Discord or Telegram to get access to free tutorials and updates.

The kbd tag (HTML Keyboard Input) is used to define a span of inline text denoting textual user input from a keyboard or any other text entry device. Its contents are rendered using the browser’s default monospaced font.

Syntax

<kbd>Some text here</kbd>

This element has only HTML Global attributes.

Example – simple kbd tag

<!DOCTYPE html>
<html>
    <head>
        <title>HTML kbd tag</title>
    </head>
<body>
    <p>Press <kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Esc</kbd> to start Task manager.</p>
</body>
</html>

Output

Press Ctrl + Alt + Esc to start Task manager.

You can add CSS to get richer effect.

Example

<!DOCTYPE html>
<html>
<head>
    <title>HTML kbd tag</title>
    <style>
        kbd{
            border: 1px solid black;
            background-color: #F5F5F5;
        }
    </style>
</head>
<body>
    <p>Press <kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Esc</kbd> to start Task manager.</p>
</body>
</html>

Output

Press Ctrl + Alt + Esc to start Task manager.