var: The Variable element
The <var>
HTML element represents the name of a variable in a mathematical expression or a programming context. It’s typically presented using an italicized version of the current typeface, although that behavior is browser-dependent.
Attributes
Global attributes
accesskey
Specifies a keyboard shortcut to activate or focus an element.
aria-*
Defines accessibility properties and states for assistive technologies.
class
Specifies one or more CSS class names for styling the element.
data-*
Stores custom data private to the page or application.
dir
Sets the text direction (left-to-right, right-to-left, or auto).
hidden
Hides the element from display and assistive technologies.
id
Defines a unique identifier for the element within the document.
inputmode
Hints which virtual keyboard type to display on mobile devices.
itemid
Provides a global identifier for microdata items.
itemprop
Defines a property name-value pair for microdata.
itemref
Associates properties with an item via element IDs for microdata.
itemscope
Creates a new microdata item container.
itemtype
Specifies the vocabulary URL for microdata items (like Schema.org).
lang
Specifies the primary language of the element’s content.
nonce
Provides a cryptographic nonce for Content Security Policy.
role
Defines the element’s semantic role for accessibility.
tabindex
Controls keyboard navigation order and focusability.
title
Provides advisory information displayed as a tooltip.
Example
<p>In your CSS, you can use custom properties like <var>--primary-color</var> to maintain consistent theming across your site.</p>
<p>When setting up your static site generator, configure the <var>baseURL</var> variable to match your domain name.</p>
<p>The formula for calculating your website's carbon footprint is roughly <var>data_transfer</var> × <var>energy_intensity</var> × <var>carbon_intensity</var>.</p>
<p>In your build script, set the <var>NODE_ENV</var> environment variable to <code>production</code> for optimized builds.</p>
<p>Your web analytics might track variables like <var>page_views</var>, <var>unique_visitors</var>, and <var>bounce_rate</var> to understand your audience.</p>