Image block

Use the image block to show an image in your form, with an optional caption.

What it shows

The block displays an image and can show text below it. alt provides alternative text for screen readers. The block collects no answer.

Configuration

Property	Type	Required	Default	Allowed values / validation	Description
`type`	string	Yes	n/a	`image`	Selects the block.
`src`	string	Yes	n/a	At least 1 character; an image URL	Image to show.
`alt`	string	Yes	n/a	Any text; may be empty	Alternative text for screen readers.
`caption`	string	No	None	Any text	Text shown under the image.
`alignment`	string	No	`center`	`left`, `center`, `right`	Horizontal position.
`size`	string	No	`full`	`tiny` (160 px), `xs` (240 px), `small` (320 px), `medium` (640 px), `large` (960 px), `full` (100% of form width)	Largest width of the image.
`maxWidth`	number	No	None (`size` determines width)	Pixels	Maximum width in pixels. When set, it replaces `size`.
`aspectRatio`	string	No	`original`	`original`, `16:9`, `4:3`, `1:1`, `custom`	Shape of the image frame.
`lazy`	boolean	No	`true`	`true`, `false`	When `true`, the image loads when it is about to scroll into view; when `false`, it loads at once.
`visible_if`	condition array	No	None	Same condition format as fields	Shows the block when the condition is true.
`hide_if`	condition array	No	None	Same condition format as fields	Hides the block when the condition is true.

Where to use it

Add the block to the ui array on a start page, question page, or end page. End pages hold display blocks only.

The block’s visibility follows the shared rule: it is shown when visible_if is true or absent, and hide_if is not true.

Example

{
  "type": "image",
  "src": "https://images.unsplash.com/photo-1522202176988-66273c2fd55f",
  "alt": "Team working together at a table",
  "caption": "Our 2026 workshop",
  "alignment": "center",
  "size": "medium",
  "aspectRatio": "16:9",
  "lazy": true
}