diff --git a/examples/index.html b/examples/index.html
index c475937..8256ceb 100644
--- a/examples/index.html
+++ b/examples/index.html
@@ -96,6 +96,11 @@
 		label {
 			white-space: nowrap;
 		}
+
+		.control-section ul {
+			margin-top: 0;
+			padding-left: 20px;
+		}
 	</style>
 </head>
 
@@ -190,6 +195,13 @@
 			</div>
 		</div>
 
+		<div class="control-section">
+			<h1>Other examples</h1>
+			<ul>
+				<li><a href="offscreen-render.html">offscreen-render</a></li>
+			</ul>
+		</div>
+
 	</div>
 
 	<footer>
diff --git a/examples/offscreen-render.html b/examples/offscreen-render.html
new file mode 100644
index 0000000..249aaad
--- /dev/null
+++ b/examples/offscreen-render.html
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+    <title>skinview3d / offscreen-render</title>
+</head>
+
+<body>
+    <div id="rendered_imgs"></div>
+    <script src="../bundles/skinview3d.bundle.js"></script>
+    <script>
+        const textures = [
+            {
+                skin: "img/1_8_texturemap_redux.png",
+                cape: null
+            },
+            {
+                skin: "img/hacksore.png",
+                cape: "img/legacy_cape.png"
+            },
+            {
+                skin: "img/haka.png",
+                cape: null
+            },
+            {
+                skin: "img/hatsune_miku.png",
+                cape: "img/mojang_cape.png"
+            },
+            {
+                skin: "img/ironman_hd.png",
+                cape: "img/hd_cape.png"
+            },
+            {
+                skin: "img/sethbling.png",
+                cape: null
+            }
+        ];
+
+        (async function () {
+            const skinViewer = new skinview3d.FXAASkinViewer({
+                width: 200,
+                height: 300,
+                alpha: false,
+                renderPaused: true
+            });
+            skinViewer.renderer.setClearColor(0x5a76f3);
+            skinViewer.camera.rotation.x = -0.620;
+            skinViewer.camera.rotation.y = 0.534;
+            skinViewer.camera.rotation.z = 0.348;
+            skinViewer.camera.position.x = 30.5;
+            skinViewer.camera.position.y = 18.0;
+            skinViewer.camera.position.z = 42.0;
+
+            for (const { skin, cape } of textures) {
+                await Promise.all([skinViewer.loadSkin(skin), skinViewer.loadCape(cape)]);
+                skinViewer.render();
+                const image = skinViewer.canvas.toDataURL();
+
+                const imgElement = document.createElement("img");
+                imgElement.src = image;
+                imgElement.width = skinViewer.width;
+                imgElement.height = skinViewer.height;
+                document.getElementById("rendered_imgs").appendChild(imgElement);
+            }
+
+            skinViewer.dispose();
+        })();
+    </script>
+</body>
+
+</html>
