Introduction
The Storyblok Image Service provides an API for programmatically changing images stored as assets in the Storyblok CMS. Use the Image Service to, for example, change the file format, optimize the quality, resize, or apply various other filters. This ensures that the right format is served across different channels while leaving the original asset unchanged.
Use the Image Service by appending one or more parameters to the base asset URL. For example, appending /m/500x300
will resize the image to 500 by 300 pixels.
Appending /m/
is required for all subsequent Image Service operations. It converts the image to the WebP format (if supported by the browser).
Try resizing the image in the interactive demo below.
The majority of Image Service operations are applied by appending /filters:FILTER_NAME(FILTER_VALUE)
. Multiple filters can be chained with a colon: /filters:FILTER1_NAME(FILTER1_VALUE):FILTER2_NAME(FILTER2_VALUE)
.
Try combining the quality and brightness filters in the interactive demo below.
Please note that the URL of Storyblok-hosted assets depends on the region the space is located in. Learn more in the assets documentation.
All image MIME types specified in the assets documentation are supported. Please note that for GIF images (including animated GIF images), only resizing is supported.
Using Storyblok's Image Service is subject to technical limits.