HTML <figcaption> Element
The <figcaption> element provides a caption or description for content contained within a <figure> element. It can describe an image, illustration, diagram, code example, quotation, or other self-contained content represented by the figure.
Syntax
<figure>
<img src="example.jpg" alt="Mountain landscape">
<figcaption>A mountain landscape at sunrise.</figcaption>
</figure>
The <figcaption> element is placed inside a <figure> element and provides a caption for the figure's content.
Attributes
The <figcaption> element supports the global HTML attributes. It does not have any element-specific attributes.
Example
The following example places an image and its caption together inside a <figure> element:
Usage Notes
A <figcaption> element must be used as part of a <figure>. A figure can contain only one <figcaption>.
The <figcaption> may appear as the first or last child of its <figure>, allowing the caption to be placed before or after the figure's main content.
A caption can contain more than a short label. Depending on the figure, it may include explanatory text, attribution, links, or other content that helps describe or provide context for the figure.
The <figcaption> element is not limited to images. It can caption other content contained in a <figure>, including code examples, diagrams, illustrations, tables, and quotations.
Accessibility
Write captions that provide useful context for the figure without unnecessarily repeating information already available in the surrounding content.
For images, <figcaption> does not automatically replace the need for an appropriate alt attribute. The image's alternative text and the figure caption serve different purposes and should be written according to the information each needs to communicate.
Browser Support
Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.
For detailed browser compatibility information, see Can I Use: HTML <figcaption> Element .
Related Elements
<figure> - Represents self-contained content that can optionally include a caption.
<img> - Embeds an image that can be included within a figure.
<picture> - Provides alternative image sources for different display conditions and can be placed within a figure.
