thumbnail.png -> thumbnail.webp (#74)

pmndrs · Aug 14, 2024 · 0319163 · 0319163
1 parent 0e45957
commit 0319163
Show file tree

Hide file tree

Showing 473 changed files with 161 additions and 161 deletions.
diff --git a/apps/website/lib/helper.ts b/apps/website/lib/helper.ts
@@ -24,7 +24,7 @@ export function getDemos() {
 
       return {
         name: demoname,
-        thumb: `${embed_url}/thumbnail.png`,
+        thumb: `${embed_url}/thumbnail.webp`,
         embed_url,
         website_url,
       };

diff --git a/demos/aquarium/README.md b/demos/aquarium/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/aquarium)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/aquarium)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/aquarium/thumbnail.png b/demos/aquarium/thumbnail.png
diff --git a/demos/aquarium/thumbnail.webp b/demos/aquarium/thumbnail.webp
diff --git a/demos/arkanoid-under-60-loc/README.md b/demos/arkanoid-under-60-loc/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/arkanoid-under-60-loc)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/arkanoid-under-60-loc)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/arkanoid-under-60-loc/thumbnail.png b/demos/arkanoid-under-60-loc/thumbnail.png
diff --git a/demos/arkanoid-under-60-loc/thumbnail.webp b/demos/arkanoid-under-60-loc/thumbnail.webp
diff --git a/demos/arkanoid/README.md b/demos/arkanoid/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/arkanoid)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/arkanoid)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/arkanoid/thumbnail.png b/demos/arkanoid/thumbnail.png
diff --git a/demos/arkanoid/thumbnail.webp b/demos/arkanoid/thumbnail.webp
diff --git a/demos/audio-analyser/README.md b/demos/audio-analyser/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/audio-analyser)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/audio-analyser)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/audio-analyser/thumbnail.png b/demos/audio-analyser/thumbnail.png
diff --git a/demos/audio-analyser/thumbnail.webp b/demos/audio-analyser/thumbnail.webp
diff --git a/demos/backdrop-and-cables/README.md b/demos/backdrop-and-cables/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/backdrop-and-cables)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/backdrop-and-cables)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/backdrop-and-cables/thumbnail.png b/demos/backdrop-and-cables/thumbnail.png
diff --git a/demos/backdrop-and-cables/thumbnail.webp b/demos/backdrop-and-cables/thumbnail.webp
diff --git a/demos/baking-soft-shadows/README.md b/demos/baking-soft-shadows/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/baking-soft-shadows)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/baking-soft-shadows)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/baking-soft-shadows/thumbnail.png b/demos/baking-soft-shadows/thumbnail.png
diff --git a/demos/baking-soft-shadows/thumbnail.webp b/demos/baking-soft-shadows/thumbnail.webp
diff --git a/demos/basic-ballpit/README.md b/demos/basic-ballpit/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/basic-ballpit)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/basic-ballpit)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/basic-ballpit/thumbnail.png b/demos/basic-ballpit/thumbnail.png
diff --git a/demos/basic-ballpit/thumbnail.webp b/demos/basic-ballpit/thumbnail.webp
diff --git a/demos/basic-demo/README.md b/demos/basic-demo/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/basic-demo)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/basic-demo)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/basic-demo/thumbnail.png b/demos/basic-demo/thumbnail.png
diff --git a/demos/basic-demo/thumbnail.webp b/demos/basic-demo/thumbnail.webp
diff --git a/demos/bestservedbold-christmas-baubles/README.md b/demos/bestservedbold-christmas-baubles/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/bestservedbold-christmas-baubles)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/bestservedbold-christmas-baubles)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/bestservedbold-christmas-baubles/thumbnail.png b/demos/bestservedbold-christmas-baubles/thumbnail.png
diff --git a/demos/bestservedbold-christmas-baubles/thumbnail.webp b/demos/bestservedbold-christmas-baubles/thumbnail.webp
diff --git a/demos/bezier-curves-and-nodes/README.md b/demos/bezier-curves-and-nodes/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/bezier-curves-and-nodes)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/bezier-curves-and-nodes)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/bezier-curves-and-nodes/thumbnail.png b/demos/bezier-curves-and-nodes/thumbnail.png
diff --git a/demos/bezier-curves-and-nodes/thumbnail.webp b/demos/bezier-curves-and-nodes/thumbnail.webp
diff --git a/demos/bloom-hdr-workflow-gltf/README.md b/demos/bloom-hdr-workflow-gltf/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/bloom-hdr-workflow-gltf)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/bloom-hdr-workflow-gltf)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/bloom-hdr-workflow-gltf/thumbnail.png b/demos/bloom-hdr-workflow-gltf/thumbnail.png
diff --git a/demos/bloom-hdr-workflow-gltf/thumbnail.webp b/demos/bloom-hdr-workflow-gltf/thumbnail.webp
diff --git a/demos/bouncy-watch/README.md b/demos/bouncy-watch/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/bouncy-watch)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/bouncy-watch)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/bouncy-watch/thumbnail.png b/demos/bouncy-watch/thumbnail.png
diff --git a/demos/bouncy-watch/thumbnail.webp b/demos/bouncy-watch/thumbnail.webp
diff --git a/demos/bounds-and-makedefault/README.md b/demos/bounds-and-makedefault/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/bounds-and-makedefault)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/bounds-and-makedefault)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/bounds-and-makedefault/thumbnail.png b/demos/bounds-and-makedefault/thumbnail.png
diff --git a/demos/bounds-and-makedefault/thumbnail.webp b/demos/bounds-and-makedefault/thumbnail.webp
diff --git a/demos/bruno-simons-20k-challenge/README.md b/demos/bruno-simons-20k-challenge/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/bruno-simons-20k-challenge)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/bruno-simons-20k-challenge)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/bruno-simons-20k-challenge/thumbnail.png b/demos/bruno-simons-20k-challenge/thumbnail.png
diff --git a/demos/bruno-simons-20k-challenge/thumbnail.webp b/demos/bruno-simons-20k-challenge/thumbnail.webp
diff --git a/demos/building-dynamic-envmaps/README.md b/demos/building-dynamic-envmaps/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/building-dynamic-envmaps)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/building-dynamic-envmaps)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/building-dynamic-envmaps/thumbnail.png b/demos/building-dynamic-envmaps/thumbnail.png
diff --git a/demos/building-dynamic-envmaps/thumbnail.webp b/demos/building-dynamic-envmaps/thumbnail.webp
diff --git a/demos/building-live-envmaps/README.md b/demos/building-live-envmaps/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/building-live-envmaps)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/building-live-envmaps)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/building-live-envmaps/thumbnail.png b/demos/building-live-envmaps/thumbnail.png
diff --git a/demos/building-live-envmaps/thumbnail.webp b/demos/building-live-envmaps/thumbnail.webp
diff --git a/demos/bvh/README.md b/demos/bvh/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/bvh)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/bvh)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/bvh/thumbnail.png b/demos/bvh/thumbnail.png
diff --git a/demos/bvh/thumbnail.webp b/demos/bvh/thumbnail.webp
diff --git a/demos/camera-scroll/README.md b/demos/camera-scroll/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/camera-scroll)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/camera-scroll)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/camera-scroll/thumbnail.png b/demos/camera-scroll/thumbnail.png
diff --git a/demos/camera-scroll/thumbnail.webp b/demos/camera-scroll/thumbnail.webp
diff --git a/demos/camera-shake/README.md b/demos/camera-shake/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/camera-shake)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/camera-shake)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/camera-shake/thumbnail.png b/demos/camera-shake/thumbnail.png
diff --git a/demos/camera-shake/thumbnail.webp b/demos/camera-shake/thumbnail.webp
diff --git a/demos/canvas-text/README.md b/demos/canvas-text/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/canvas-text)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/canvas-text)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/canvas-text/thumbnail.png b/demos/canvas-text/thumbnail.png
diff --git a/demos/canvas-text/thumbnail.webp b/demos/canvas-text/thumbnail.webp
diff --git a/demos/cards-with-border-radius/README.md b/demos/cards-with-border-radius/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/cards-with-border-radius)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/cards-with-border-radius)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/cards-with-border-radius/thumbnail.png b/demos/cards-with-border-radius/thumbnail.png
diff --git a/demos/cards-with-border-radius/thumbnail.webp b/demos/cards-with-border-radius/thumbnail.webp
diff --git a/demos/cards/README.md b/demos/cards/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/cards)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/cards)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/cards/thumbnail.png b/demos/cards/thumbnail.png
diff --git a/demos/cards/thumbnail.webp b/demos/cards/thumbnail.webp
diff --git a/demos/caustics/README.md b/demos/caustics/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/caustics)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/caustics)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/caustics/thumbnail.png b/demos/caustics/thumbnail.png
diff --git a/demos/caustics/thumbnail.webp b/demos/caustics/thumbnail.webp
diff --git a/demos/cell-fracture/README.md b/demos/cell-fracture/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/cell-fracture)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/cell-fracture)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/cell-fracture/thumbnail.png b/demos/cell-fracture/thumbnail.png
diff --git a/demos/cell-fracture/thumbnail.webp b/demos/cell-fracture/thumbnail.webp
diff --git a/demos/clones/README.md b/demos/clones/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/clones)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/clones)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/clones/thumbnail.png b/demos/clones/thumbnail.png
diff --git a/demos/clones/thumbnail.webp b/demos/clones/thumbnail.webp
diff --git a/demos/clouds/README.md b/demos/clouds/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/clouds)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/clouds)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/clouds/thumbnail.png b/demos/clouds/thumbnail.png
diff --git a/demos/clouds/thumbnail.webp b/demos/clouds/thumbnail.webp
diff --git a/demos/color-grading/README.md b/demos/color-grading/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/color-grading)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/color-grading)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/color-grading/thumbnail.png b/demos/color-grading/thumbnail.png
diff --git a/demos/color-grading/thumbnail.webp b/demos/color-grading/thumbnail.webp
diff --git a/demos/confetti/README.md b/demos/confetti/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/confetti)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/confetti)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/confetti/thumbnail.png b/demos/confetti/thumbnail.png
diff --git a/demos/confetti/thumbnail.webp b/demos/confetti/thumbnail.webp
diff --git a/demos/csg-bunny-usegroups/README.md b/demos/csg-bunny-usegroups/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/csg-bunny-usegroups)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/csg-bunny-usegroups)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/csg-bunny-usegroups/thumbnail.png b/demos/csg-bunny-usegroups/thumbnail.png
diff --git a/demos/csg-bunny-usegroups/thumbnail.webp b/demos/csg-bunny-usegroups/thumbnail.webp
diff --git a/demos/csg-house/README.md b/demos/csg-house/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/csg-house)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/csg-house)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/csg-house/thumbnail.png b/demos/csg-house/thumbnail.png
diff --git a/demos/csg-house/thumbnail.webp b/demos/csg-house/thumbnail.webp
diff --git a/demos/csg-operations-rapier-physics/README.md b/demos/csg-operations-rapier-physics/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/csg-operations-rapier-physics)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/csg-operations-rapier-physics)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/csg-operations-rapier-physics/thumbnail.png b/demos/csg-operations-rapier-physics/thumbnail.png
diff --git a/demos/csg-operations-rapier-physics/thumbnail.webp b/demos/csg-operations-rapier-physics/thumbnail.webp
diff --git a/demos/dbismut-furniture/README.md b/demos/dbismut-furniture/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/dbismut-furniture)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/dbismut-furniture)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/dbismut-furniture/thumbnail.png b/demos/dbismut-furniture/thumbnail.png
diff --git a/demos/dbismut-furniture/thumbnail.webp b/demos/dbismut-furniture/thumbnail.webp
diff --git a/demos/diamond-refraction/README.md b/demos/diamond-refraction/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/diamond-refraction)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/diamond-refraction)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/diamond-refraction/thumbnail.png b/demos/diamond-refraction/thumbnail.png
diff --git a/demos/diamond-refraction/thumbnail.webp b/demos/diamond-refraction/thumbnail.webp
diff --git a/demos/diamond-ring/README.md b/demos/diamond-ring/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/diamond-ring)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/diamond-ring)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/diamond-ring/thumbnail.png b/demos/diamond-ring/thumbnail.png
diff --git a/demos/diamond-ring/thumbnail.webp b/demos/diamond-ring/thumbnail.webp
diff --git a/demos/drei-rendertexture/README.md b/demos/drei-rendertexture/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/drei-rendertexture)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/drei-rendertexture)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/drei-rendertexture/thumbnail.png b/demos/drei-rendertexture/thumbnail.png
diff --git a/demos/drei-rendertexture/thumbnail.webp b/demos/drei-rendertexture/thumbnail.webp
diff --git a/demos/ecctrl-fisheye/README.md b/demos/ecctrl-fisheye/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/ecctrl-fisheye)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/ecctrl-fisheye)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/ecctrl-fisheye/thumbnail.png b/demos/ecctrl-fisheye/thumbnail.png
diff --git a/demos/ecctrl-fisheye/thumbnail.webp b/demos/ecctrl-fisheye/thumbnail.webp
diff --git a/demos/edgesgeometry/README.md b/demos/edgesgeometry/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/edgesgeometry)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/edgesgeometry)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/edgesgeometry/thumbnail.png b/demos/edgesgeometry/thumbnail.png
diff --git a/demos/edgesgeometry/thumbnail.webp b/demos/edgesgeometry/thumbnail.webp
diff --git a/demos/enter-portals/README.md b/demos/enter-portals/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/enter-portals)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/enter-portals)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/enter-portals/thumbnail.png b/demos/enter-portals/thumbnail.png
diff --git a/demos/enter-portals/thumbnail.webp b/demos/enter-portals/thumbnail.webp
diff --git a/demos/environment-blur-and-transitions/README.md b/demos/environment-blur-and-transitions/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/environment-blur-and-transitions)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/environment-blur-and-transitions)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/environment-blur-and-transitions/thumbnail.png b/demos/environment-blur-and-transitions/thumbnail.png
diff --git a/demos/environment-blur-and-transitions/thumbnail.webp b/demos/environment-blur-and-transitions/thumbnail.webp
diff --git a/demos/envmap-ground-projection/README.md b/demos/envmap-ground-projection/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/envmap-ground-projection)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/envmap-ground-projection)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/envmap-ground-projection/thumbnail.png b/demos/envmap-ground-projection/thumbnail.png
diff --git a/demos/envmap-ground-projection/thumbnail.webp b/demos/envmap-ground-projection/thumbnail.webp
diff --git a/demos/faucets-select-highlight/README.md b/demos/faucets-select-highlight/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/faucets-select-highlight)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/faucets-select-highlight)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/faucets-select-highlight/thumbnail.png b/demos/faucets-select-highlight/thumbnail.png
diff --git a/demos/faucets-select-highlight/thumbnail.webp b/demos/faucets-select-highlight/thumbnail.webp
diff --git a/demos/flexbox-yoga-in-webgl/README.md b/demos/flexbox-yoga-in-webgl/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/flexbox-yoga-in-webgl)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/flexbox-yoga-in-webgl)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/flexbox-yoga-in-webgl/thumbnail.png b/demos/flexbox-yoga-in-webgl/thumbnail.png
diff --git a/demos/flexbox-yoga-in-webgl/thumbnail.webp b/demos/flexbox-yoga-in-webgl/thumbnail.webp
diff --git a/demos/floating-diamonds/README.md b/demos/floating-diamonds/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/floating-diamonds)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/floating-diamonds)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/floating-diamonds/thumbnail.png b/demos/floating-diamonds/thumbnail.png
diff --git a/demos/floating-diamonds/thumbnail.webp b/demos/floating-diamonds/thumbnail.webp
diff --git a/demos/floating-instanced-shoes/README.md b/demos/floating-instanced-shoes/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/floating-instanced-shoes)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/floating-instanced-shoes)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/floating-instanced-shoes/thumbnail.png b/demos/floating-instanced-shoes/thumbnail.png
diff --git a/demos/floating-instanced-shoes/thumbnail.webp b/demos/floating-instanced-shoes/thumbnail.webp
diff --git a/demos/floating-laptop/README.md b/demos/floating-laptop/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/floating-laptop)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/floating-laptop)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/floating-laptop/thumbnail.png b/demos/floating-laptop/thumbnail.png
diff --git a/demos/floating-laptop/thumbnail.webp b/demos/floating-laptop/thumbnail.webp
diff --git a/demos/flying-bananas/README.md b/demos/flying-bananas/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/flying-bananas)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/flying-bananas)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/flying-bananas/thumbnail.png b/demos/flying-bananas/thumbnail.png
diff --git a/demos/flying-bananas/thumbnail.webp b/demos/flying-bananas/thumbnail.webp
diff --git a/demos/frosted-glass/README.md b/demos/frosted-glass/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/frosted-glass)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/frosted-glass)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/frosted-glass/thumbnail.png b/demos/frosted-glass/thumbnail.png
diff --git a/demos/frosted-glass/thumbnail.webp b/demos/frosted-glass/thumbnail.webp
diff --git a/demos/gatsby-stars/README.md b/demos/gatsby-stars/README.md
@@ -2,4 +2,4 @@
 [![CodeSandbox](https://img.shields.io/badge/codesandbox-040404?logo=codesandbox&logoColor=DBDBDB)](https://codesandbox.io/s/github/pmndrs/examples/tree/main/demos/gatsby-stars)
 [![Stackblitz](https://img.shields.io/badge/stackblitz-fff?logo=Stackblitz&logoColor=1389FD)](https://stackblitz.com/github/pmndrs/examples/tree/main/demos/gatsby-stars)
 
-![](thumbnail.png)
+![](thumbnail.webp)
diff --git a/demos/gatsby-stars/thumbnail.png b/demos/gatsby-stars/thumbnail.png
diff --git a/demos/gatsby-stars/thumbnail.webp b/demos/gatsby-stars/thumbnail.webp