Images & Media

This page demonstrates image handling in the dark theme.

Inline Images

You can include small inline images Antora 3.x within text, like badges.

Here’s another badge: License: MIT

Block Images

Basic Image

Sample Image

Image with Caption

Dark Theme Colors
Figure 1. A placeholder image demonstrating dark theme colors

Image with Title and Alt Text

Navbar Background Color
Figure 2. Figure 1: Theme Color Palette

Image Alignment

Left Aligned Image

Left aligned

This text flows around the left-aligned image. The dark theme ensures images integrate well with the surrounding content regardless of alignment. Notice how the text wraps naturally around the image.



Right Aligned Image

Right aligned

This text flows around the right-aligned image. Right alignment is useful for supplementary visuals that support the main content. The clear float ensures content flows properly.



Center Aligned Image

Centered image

Image Sizes

Small Image

Small

Medium Image

Medium

Large Image

Large

Image Gallery

Image 1 Image 2 Image 3

Icons

When icons are enabled (:icons: font), you can use Font Awesome icons:

Success indicator

Warning indicator

Error indicator

Information

GitHub icon

Code icon

Video Placeholder

Video embeds depend on your Antora configuration and extensions. Below is an example of how video might be embedded.
Example 1. Example Video Embed (iframe)

Videos would be embedded here using an HTML passthrough or video macro. The dark theme styles the surrounding container appropriately.

Figure References

Refer to Figure 1: Theme Color Palette for an example of the theme color palette.

Image in Table

Preview Description

Thumbnail

This is a thumbnail image inside a table cell.

Dark theme

Another image demonstrating dark colors in a table.

Image in Admonition

Here’s a visual tip:

Tip with image

Images work well inside admonition blocks.