From bb64964d0b6ab114de473a3d9dbc19e44ad21178 Mon Sep 17 00:00:00 2001
From: kvvasuu <lukaszkwas96@gmail.com>
Date: Fri, 21 Aug 2026 21:57:16 +0200
Subject: [PATCH] docs: link effect examples to pmndrs/examples

Replace stale CodeSandbox embeds with live examples.pmnd.rs links and add missing Example sections for SelectiveBloom and SSAO, following pmndrs/examples#219.
---
 docs/effects/autofocus.mdx           | 2 +-
 docs/effects/bloom.mdx               | 2 +-
 docs/effects/brightness-contrast.mdx | 2 +-
 docs/effects/color-average.mdx       | 2 +-
 docs/effects/depth-of-field.mdx      | 2 +-
 docs/effects/glitch.mdx              | 2 +-
 docs/effects/hue-saturation.mdx      | 2 +-
 docs/effects/noise.mdx               | 2 +-
 docs/effects/ramp.mdx                | 2 +-
 docs/effects/selective-bloom.mdx     | 4 ++++
 docs/effects/ssao.mdx                | 4 ++++
 docs/effects/tone-mapping.mdx        | 2 +-
 12 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/docs/effects/autofocus.mdx b/docs/effects/autofocus.mdx
index 159884c6..bad1e2c8 100644
--- a/docs/effects/autofocus.mdx
+++ b/docs/effects/autofocus.mdx
@@ -49,4 +49,4 @@ useFrame((_, delta) => {
 
 ## Example
 
-<Codesandbox id="dfw6w4" />
+[![Autofocus demo](https://pmndrs.github.io/examples/autofocus/thumbnail.webp)](https://pmndrs.github.io/examples/autofocus)
diff --git a/docs/effects/bloom.mdx b/docs/effects/bloom.mdx
index f3b7193e..2ca74eb9 100644
--- a/docs/effects/bloom.mdx
+++ b/docs/effects/bloom.mdx
@@ -50,7 +50,7 @@ clamp colors between 0 and 1 again.
 
 ## Example
 
-<Codesandbox id="r9ujf" />
+[![Bloom demo](https://pmndrs.github.io/examples/bloom/thumbnail.webp)](https://pmndrs.github.io/examples/bloom)
 
 ## Props
 
diff --git a/docs/effects/brightness-contrast.mdx b/docs/effects/brightness-contrast.mdx
index c55eb8af..f43a195c 100644
--- a/docs/effects/brightness-contrast.mdx
+++ b/docs/effects/brightness-contrast.mdx
@@ -18,7 +18,7 @@ return (
 
 ## Example
 
-<Codesandbox id="rrev1" />
+[![BrightnessContrast demo](https://pmndrs.github.io/examples/brightness-contrast/thumbnail.webp)](https://pmndrs.github.io/examples/brightness-contrast)
 
 ## Props
 
diff --git a/docs/effects/color-average.mdx b/docs/effects/color-average.mdx
index a4f09532..76ac1a52 100644
--- a/docs/effects/color-average.mdx
+++ b/docs/effects/color-average.mdx
@@ -18,7 +18,7 @@ return (
 
 ## Example
 
-<Codesandbox id="ulsyy" />
+[![ColorAverage demo](https://pmndrs.github.io/examples/color-average/thumbnail.webp)](https://pmndrs.github.io/examples/color-average)
 
 ## Props
 
diff --git a/docs/effects/depth-of-field.mdx b/docs/effects/depth-of-field.mdx
index 287e7844..95e3125a 100644
--- a/docs/effects/depth-of-field.mdx
+++ b/docs/effects/depth-of-field.mdx
@@ -21,7 +21,7 @@ return (
 
 ## Example
 
-<Codesandbox id="bu796" />
+[![DepthOfField demo](https://pmndrs.github.io/examples/depth-of-field/thumbnail.webp)](https://pmndrs.github.io/examples/depth-of-field)
 
 ## Props
 
diff --git a/docs/effects/glitch.mdx b/docs/effects/glitch.mdx
index f2a07679..e44e5743 100644
--- a/docs/effects/glitch.mdx
+++ b/docs/effects/glitch.mdx
@@ -23,7 +23,7 @@ return (
 
 ## Example
 
-<Codesandbox id="bs1i1" />
+[![Glitch demo](https://pmndrs.github.io/examples/glitch/thumbnail.webp)](https://pmndrs.github.io/examples/glitch)
 
 ## Props
 
diff --git a/docs/effects/hue-saturation.mdx b/docs/effects/hue-saturation.mdx
index a1b3fa5d..9e443e24 100644
--- a/docs/effects/hue-saturation.mdx
+++ b/docs/effects/hue-saturation.mdx
@@ -20,7 +20,7 @@ return (
 
 ## Example
 
-<Codesandbox id="m9min" />
+[![HueSaturation demo](https://pmndrs.github.io/examples/hue-saturation/thumbnail.webp)](https://pmndrs.github.io/examples/hue-saturation)
 
 ## Props
 
diff --git a/docs/effects/noise.mdx b/docs/effects/noise.mdx
index 80d2a976..5411f81f 100644
--- a/docs/effects/noise.mdx
+++ b/docs/effects/noise.mdx
@@ -19,7 +19,7 @@ return (
 
 ## Example
 
-<Codesandbox id="8l8hi" />
+[![Noise demo](https://pmndrs.github.io/examples/noise/thumbnail.webp)](https://pmndrs.github.io/examples/noise)
 
 ## Props
 
diff --git a/docs/effects/ramp.mdx b/docs/effects/ramp.mdx
index c373be3f..2e97fd63 100644
--- a/docs/effects/ramp.mdx
+++ b/docs/effects/ramp.mdx
@@ -25,7 +25,7 @@ return (
 
 ## Example
 
-<Codesandbox id="zdpzei" />
+[![Ramp demo](https://pmndrs.github.io/examples/ramp/thumbnail.webp)](https://pmndrs.github.io/examples/ramp)
 
 ## Props
 
diff --git a/docs/effects/selective-bloom.mdx b/docs/effects/selective-bloom.mdx
index 08c05bc6..db127111 100644
--- a/docs/effects/selective-bloom.mdx
+++ b/docs/effects/selective-bloom.mdx
@@ -34,6 +34,10 @@ return (
 )
 ```
 
+## Example
+
+[![SelectiveBloom demo](https://pmndrs.github.io/examples/selective-bloom/thumbnail.webp)](https://pmndrs.github.io/examples/selective-bloom)
+
 ## Props
 
 | Name               | Type          | Default              | Description                                                                                          |
diff --git a/docs/effects/ssao.mdx b/docs/effects/ssao.mdx
index 9e6d4bf4..1bc8e559 100644
--- a/docs/effects/ssao.mdx
+++ b/docs/effects/ssao.mdx
@@ -29,6 +29,10 @@ return (
 )
 ```
 
+## Example
+
+[![SSAO demo](https://pmndrs.github.io/examples/ssao/thumbnail.webp)](https://pmndrs.github.io/examples/ssao)
+
 ## Props
 
 | Name                    | Type                                                                                                          | Default               | Description                                                                                                                     |
diff --git a/docs/effects/tone-mapping.mdx b/docs/effects/tone-mapping.mdx
index 0d7cd1c7..556190c4 100644
--- a/docs/effects/tone-mapping.mdx
+++ b/docs/effects/tone-mapping.mdx
@@ -37,7 +37,7 @@ return (
 
 ## Example
 
-<Codesandbox id="fjb06" />
+[![ToneMapping demo](https://pmndrs.github.io/examples/tone-mapping/thumbnail.webp)](https://pmndrs.github.io/examples/tone-mapping)
 
 ## Props