This guide shows how to add and render images in content and templates with Thulite Images.

Supported formats

Thulite Images supports all image formats that Hugo can process. For the complete and current list, see processable images.

Image placement

Image placement

Store your images as page, section, global, or remote resources.

Add to content

Add images to content pages with standard Markdown syntax or the img, picture, and figure shortcodes.

Markdown syntax

Markdown

Add optimized, lazy-loaded images to content pages using standard Markdown image syntax.

Shortcodes

img

Render a responsive image with lazy loading and LQIP support.

picture

Render a responsive image with format negotiation (e.g. WebP with JPEG fallback).

figure

Render a responsive, lazy-loaded image with an optional caption.

Add to templates

Add images to templates with the img, picture, and figure partials.

Partials

img

Render a responsive image with lazy loading and LQIP support.

picture

Render a responsive image with format negotiation (e.g. WebP with JPEG fallback).

figure

Render a responsive, lazy-loaded image with an optional caption.