Image

Setup

<script>
	import { Img } from 'svelte-5-ui-lib';
</script>

Interactive Image Builder

Warning: the caption is using @html.

Examples

Example Enhanced Retina ready

This is a caption

<script>
	import { ImgEnhanced } from 'svelte-5-ui-lib';
	import MyImage from './garnished.webp';
</script>

<ImgEnhanced src={MyImage} alt="An alt text" caption="This is a caption" sizes="100vw" />

Component data