Image Optimization in Astro with Astro ImageTools
This page demonstrates the usage of the astro-imagetools library with live examples.
layout property tells the image to respond differently depending on the device size or the container size.
Select a layout below and try resizing the window or rotating your device to see how the image reacts.
placeholder property tells the image what to show while loading.
The following is an example of a reference to an internal image in the
src directory (
The following is an example of a reference to an external image (
Image in /public
This image is in the public directory (
You can optionally configure many more things!
Checkout the Astro ImageTools documentation to learn more.