

Images
4/11/2024
Images is the official images integration for the Thulite framework.
Features
- Render hook for Markdown images.
- Shortcodes for
picture
,img
, andfigure
elements. - Partials for
picture
,img
, andfigure
elements. - Store your images as a page resource, global resource, or remote resource.
- Set defaults for
loading
,decoding
,fetchpriority
, and more. - Override defaults locally.
- Automatic
sizes
attribute calculation. - Show your images with a blurred-up LQIP.
Sensible defaults
Images comes with sensible defaults, but you can customize them in your params.toml
file.
# Images (@thulite/images)[thulite_images] [thulite_images.defaults] decoding = "async" # sync, async, or auto (default) fetchpriority = "auto" # high, low, or auto (default) loading = "lazy" # eager or lazy (default) widths = [480, 576, 768, 1025, 1200, 1440] # [640, 768, 1024, 1366, 1600, 1920] for example sizes = "auto" # 100vw (default), 75vw, or auto for example process = "" # "fill 1600x900" or "fill 2100x900" for example lqip = "16x webp q20" # "16x webp q20" or "21x webp q20" for example
Configurable
Images is highly configurable. You can set defaults for all images, override them locally, and even use the process
parameter to manipulate your images.
Full documentation
Step-by-step instructions to get started with Images can be found in the documentation.
← Back to projects