1. html
  2. /tags
  3. /samp



The <samp> element encapsulates inline text that showcases sample or quoted outputs from a computer system or program. By default, browsers typically render content within the element using a monospaced font.

Examples and Usage

When documenting or explaining software aspects, it's common to show examples of program outputs. Suppose we're documenting software and want to show its response when a user attempts to access a restricted file:

<p>When trying to open the protected file, the system responded: <samp>Access Denied: Unauthorized user.</samp></p>

This straightforward use of <samp> provides a clear distinction between regular narrative text and the system's output.

In the context of illustrating terminal or console interactions, <samp> often works with the <pre> element to keep the output format intact, preserving spaces and line breaks. In addition, the <kbd> element can be used to show user inputs or commands, making them stand out from system responses. For added clarity, you can use <span> elements in the output. With specific classes on these spans, parts like terminal prompts can get their own style. For instance, a terminal prompt could have a unique color, while user commands in <kbd> might get a background shade.

Attribute Breakdown

The <samp> element doesn't have any specific attributes; it inherits global attributes common to all HTML elements.

Accessibility Aspects

The <samp> element has a default role attribute value of generic as per the specification. While any role can be assigned, the use of generic is generally discouraged. In terms of naming, the <samp> element is prohibited from being named using ARIA naming techniques. Aside from this, the element can employ global aria-* attributes and any aria-* attributes that apply to the assigned roles. In practical terms, there are no direct accessibility considerations for this element in the majority of use cases.

Associated Elements

  • <code>
  • <kbd>
  • <output>
  • <pre>
  • <var>

Additional Notes

  • Both the start and end tags for the <samp> element are required; there's no tag omission.

  • As we previously mentioned, browsers typically display the content inside the <samp> element using a monospaced font. You can change this default look with CSS, but remember that specific browser settings might override the styles you set.

  • If you're looking to display immediate outputs, especially in web applications, the <output> element is more appropriate for this use case.

Browser Compatibility

For a detailed breakdown of specific browser nuances and older version support refer to the first link in the Useful Resources below.

BrowserChromeEdgeSafariFirefoxOperaInternet Explorer

Useful Resources

Can I use HTML element: samp

The HTML Living Standard Specification: samp