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
| Attribute | Description |
|---|---|
| None | The <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 <var> 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 | Firefox | Edge | Safari | Opera | 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.