Content display / The visual dictionary
Figure.
An image or diagram paired with a caption.
Also calledillustration figure
01
UI illustrationSee it in context
Input→Process→Result
02
What it is
A figure groups visual or illustrative material with its explanatory caption so they are understood as one unit. It can contain a photograph, diagram, chart, or code example.
When to use it
Use for referenced visual content within an article.
Know the difference
A figure is a semantic grouping; the caption is the text explaining its contents.
03
Across platforms
WebiOSiPadOSAndroidmacOSWindowsLinuxvisionOS
iOS · iPadOS · macOS · visionOS
Use the native platform presentation and terminology; adapt density and interaction to touch, pointer, remote, or spatial input rather than copying a phone-sized view.
Web · Android · Windows · Linux
Use semantic content structures on the web. Touch, pointer, and remote layouts need different target spacing even when the same information is shown.
04
Go to the source
Primary documentation for the pattern and its platform conventions.