HTML <sup> Tag

The <sup> element in HTML is used to define superscript text, which appears slightly above the normal line of text and is typically rendered in a smaller font size. Superscript text is commonly used in mathematical expressions, chemical formulas, footnotes, and trademarks to provide additional context without breaking the flow of the main content.

When applied, the content inside <sup> is visually raised relative to the surrounding text, making it ideal for notations like exponents (e.g., x²), ordinal indicators (e.g., 1st, 2nd), or reference numbers for footnotes. For example:

<p>Water has the chemical formula H<sub>2</sub>O, and the boiling point is 100<sup>o</sup>C.</p>

Here, the <sup> tag raises the "o" in "°C" above the normal text line, giving it the conventional superscript appearance.

Semantically, <sup> indicates that the content is secondary or supplementary to the main text, rather than being merely styled for visual effect. This makes it meaningful for screen readers and accessibility tools, which can interpret superscript content appropriately.

By default, most browsers render <sup> text smaller and raised, but it can also be customized with CSS for precise positioning or styling, though this is rarely necessary for typical use cases.