example/index.html

<html lang="en">
<head>
    <title>ImageScript Example</title>
</head>
<body>
<h1>ImageScript example</h1>
<p>Simple example showing integration of ImageScript into an application (load image, modify, encode, convert to blob,
    display)</p>
<p>You can find more examples on <a href="https://github.com/matmen/ImageScript/tree/master/tests">GitHub</a></p>
<img alt="ImageScript Example Result" id="image" src="https://via.placeholder.com/100x100">
<script src="https://cdn.jsdelivr.net/gh/matmen/imagescript@browser/browser/ImageScript.js"></script>
<script>
	(async () => {
		const avatar = await fetch('https://raw.githubusercontent.com/matmen/ImageScript/master/tests/targets/readme.png').then(r => r.arrayBuffer());
		const image = await ImageScript.Image.decode(avatar);

		image.saturation(0);

		const encoded = await image.encode();

		const blob = new Blob([encoded], {type: 'image/png'});
		document.querySelector('#image').src = URL.createObjectURL(blob);
	})();
</script>
</body>
</html>