> For the complete documentation index, see [llms.txt](https://lewe.gitbook.io/html-and-aui-toolkit-for-confluence/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lewe.gitbook.io/html-and-aui-toolkit-for-confluence/html-macros/html-figure-and-html-figure-caption.md).
# HTML Figure and HTML Figure Caption
#### Description
The HTML Figure and Figure Caption macros can be used to mark up images and photos on your page.
The HTML Figure element provides a body in which you can add an element and a HTML Figure Caption element for the image.
The above would look something like this:
## Adding the Macros
1. Edit your page.
2. Select “+” => Other macros
3. Type in “html” in the Search box
4. Select the “HTML Figure”, “HTML Img” and “HTML Figure Caption” macros (each at a time)
## Macro Options for HTML Figure and HTML Figure Caption
### **Element ID**
You can specify an element ID here. It must be unique on your page.
### **CSS Classes**
You can specify CSS class names here, separated by blank.
### **Inline Styles**
You can specify inline CSS properties here. Each one has to end with a semicolon.
### **Tooltip Title**
Enter a simple text here that will popup as a tooltip when the mouse is hovered over the element.
### **Custom Attributes**
You can enter fully specified custom attributes here separated by blanks, e.g.: data-animal=”cat” data-color=”red”.
