How to use
An image a page or block shows, such as a Hero's background or a quote's portrait. You fill it in on the page or block, not in a content area. The caption is shown over the image's lower corner. Screen readers read the alternative text instead of the image. Leave it empty to use the image's own description. Here the image is shown on its own; the page or block decides its size and placement.
Variants
With caption
An image with a caption. The caption is shown in the image's lower right corner.
With alternative text
An image with its own alternative text.
Without alternative text
An image with no alternative text of its own. Screen readers get the description set on the image file, and skip the image when the file has none.
Portrait image
A portrait image. It is cropped to the block's image shape.
Square image
A square image. It is cropped to the block's image shape.
Small source image
An image uploaded 480 pixels wide, smaller than the image sizes. It is enlarged and looks blurry on wider screens, and the editor gets a warning when uploading it.
No focal point
A square image with no focal point. It is cropped around the middle, and the subject in the top left corner is cut off.
Focal point set
The same image with its focal point on the subject in the top left corner. The crop follows the focal point, so the subject stays in view.
Layout preview
4 copies of one example in a layout block. Change the settings to see how the block fits each layout.