HTML5 & CSS3Tools and Tutorials
Tutorials, tools, and live experimentsOpen Tools

Tutorial Article

HTML <var> Tag

The <var> tag in HTML is used to define a variable in a mathematical expression or in a programming context.The content inside the <var> element is typically displayed in italic by default in most browsers to distinguish it from regular text.It helps semantically indicate that the enclosed text is a variable name. Syntax Attributes Attribute [&hellip;]

Nov 21, 2025HTMLHTML TagsTutorials

The <var> tag in HTML is used to define a variable in a mathematical expression or in a programming context.
The content inside the <var> element is typically displayed in italic by default in most browsers to distinguish it from regular text.
It helps semantically indicate that the enclosed text is a variable name.

Syntax

<var>variable_name</var>

Attributes

AttributeDescription
NoneThe <var> tag does not support any specific attributes other than the global and event attributes.

Example

<!DOCTYPE html>
<html>
<head>
  <title>HTML var Tag Example</title>
</head>
<body>
  <h2>HTML &lt;var&gt; Tag Example</h2>
  <p>The area of a rectangle is <var>length</var> × <var>width</var>.</p>
  <p>In the equation <var>x</var> + <var>y</var> = 10, <var>x</var> and <var>y</var> are variables.</p>
</body>
</html>

Output

Browser Output

The text inside <var> will appear in italic by default:

The area of a rectangle is length × width.

In the equation x + y = 10, x and y are variables.

Browser Support

Chrome
Chrome		Firefox
Firefox		Edge
Edge		Safari
Safari		Opera
Opera		IE
IE9+
✅Yes✅Yes✅Yes✅Yes✅Yes✅Yes

Notes

  • The <var> element is purely semantic; it doesn’t add any functional behavior — only meaning.
  • It’s mainly used in educational, scientific, or technical documents.
  • You can style it differently with CSS if desired, e.g., change the color or font style.
  • For code snippets or user input, use <code> or <kbd> instead of <var>.

Conclusion

The <var> tag semantically represents a variable in code or mathematics, improving the readability and accessibility of technical content.
Although it looks similar to italic text, it conveys specific meaning to browsers, assistive technologies, and search engines.