em

Description

The <em> element marks text with stress emphasis — the kind that changes the meaning of a sentence when spoken aloud. Moving the emphasis to a different word changes what the sentence communicates.

VB styles <em> with font-synthesis: none to prevent browsers from generating faux italic glyphs, and font-optical-sizing: auto for proper rendering in variable fonts.

When to Use

• Stress emphasis: When the emphasis changes meaning — "I love chocolate" vs "I love chocolate"
• Corrective emphasis: "Do not press that button"
• Contrastive stress: "It's not the what, it's the how"

When NOT to Use

• For alternate voice, foreign words, thoughts, ship names — use <i>
• For importance or urgency — use <strong>
• For defining terms — use <dfn>
• For work titles — use <cite>
• Purely for visual styling — use CSS font-style: italic

em vs i

Both render as italic, but carry different semantics:

Examples

Blockquote Behavior

Inside <blockquote>, VB de-emphasizes italic text — <em> and <i> become normal-style with font-weight: var(--font-weight-medium). This prevents double-emphasis, since the blockquote itself is already visually offset.

Combined Bold + Italic

When <em> is nested inside <strong> (or vice versa), VB ensures the combined style renders correctly with font-synthesis: none:

CSS Reference

Accessibility

• Some screen readers announce <em> with a change in voice tone or pitch
• This distinguishes it from <i> which is not announced differently
• Nesting <em> increases the degree of emphasis
• Do not rely on emphasis alone to convey critical meaning — combine with context

Related

• <i> — Alternate voice (foreign words, thoughts, ship names)
• <strong> — Strong importance or urgency
• <b> — Draw attention without importance
• <cite> — Titles of creative works (also italic)
• <dfn> — Defining instance of a term (italic + semi-bold)