Images

Less than a minute read
Share via:
Email Twitter Twitter

Table of Contents

Adding Images

You can import images relative to the post’s markdown file, using ./path/to/image.png or relative to the content folder root /content/posts/image.png.

Figures

Figure captions are automatically pulled from the alt-text of an image.

Placing figures directly on consecutive lines in markdown results in the figures being placed in the same block as side by side.

Lazy Loading

A loading=lazy tag is added to all images to make use of the native lazy loading available on most browers.

Image transformations

All images in the content folder are transformed on build using sharp via vite-imagetools. This lets us resize images and use the srcset property on images. All images are also converted into webp format. You can add see and these default transformations in vite.config.js.