HTML: legend

The <legend> element gives a <fieldset> group a visible name or short explanation.

Minimal example

<fieldset>
  <legend>Delivery address</legend>
  <label for="city">City</label>
  <input id="city" name="city">
</fieldset>

The legend tells users what the controls inside the fieldset have in common. Assistive technology can announce this group name while the user moves through the controls.

Use a clear name

Write a short heading that describes the group, such as “Payment method” or “Notification preferences”. The individual controls still need their own labels.

Common mistakes

• Do not use a heading outside the fieldset as a replacement for its legend.
• Do not put unrelated controls in one fieldset just to style them together.
• Keep the legend concise and avoid repeating every control label.