diff --git a/frontend/public/examples-thumbs/attiny85-blink.png b/frontend/public/examples-thumbs/attiny85-blink.png
new file mode 100644
index 00000000..02363b26
Binary files /dev/null and b/frontend/public/examples-thumbs/attiny85-blink.png differ
diff --git a/frontend/public/examples-thumbs/attiny85-blink.webp b/frontend/public/examples-thumbs/attiny85-blink.webp
new file mode 100644
index 00000000..d96d3759
Binary files /dev/null and b/frontend/public/examples-thumbs/attiny85-blink.webp differ
diff --git a/frontend/public/examples-thumbs/attiny85-button-led.png b/frontend/public/examples-thumbs/attiny85-button-led.png
new file mode 100644
index 00000000..8b674f37
Binary files /dev/null and b/frontend/public/examples-thumbs/attiny85-button-led.png differ
diff --git a/frontend/public/examples-thumbs/attiny85-button-led.webp b/frontend/public/examples-thumbs/attiny85-button-led.webp
new file mode 100644
index 00000000..44b5c4c2
Binary files /dev/null and b/frontend/public/examples-thumbs/attiny85-button-led.webp differ
diff --git a/frontend/public/examples-thumbs/attiny85-ntc-sensor.png b/frontend/public/examples-thumbs/attiny85-ntc-sensor.png
new file mode 100644
index 00000000..b13ef065
Binary files /dev/null and b/frontend/public/examples-thumbs/attiny85-ntc-sensor.png differ
diff --git a/frontend/public/examples-thumbs/attiny85-ntc-sensor.webp b/frontend/public/examples-thumbs/attiny85-ntc-sensor.webp
new file mode 100644
index 00000000..0a376f75
Binary files /dev/null and b/frontend/public/examples-thumbs/attiny85-ntc-sensor.webp differ
diff --git a/frontend/public/examples-thumbs/attiny85-pwm-fade.png b/frontend/public/examples-thumbs/attiny85-pwm-fade.png
new file mode 100644
index 00000000..056bf004
Binary files /dev/null and b/frontend/public/examples-thumbs/attiny85-pwm-fade.png differ
diff --git a/frontend/public/examples-thumbs/attiny85-pwm-fade.webp b/frontend/public/examples-thumbs/attiny85-pwm-fade.webp
new file mode 100644
index 00000000..e1ca58f7
Binary files /dev/null and b/frontend/public/examples-thumbs/attiny85-pwm-fade.webp differ
diff --git a/frontend/public/examples-thumbs/bjt-common-emitter.png b/frontend/public/examples-thumbs/bjt-common-emitter.png
new file mode 100644
index 00000000..31f6856f
Binary files /dev/null and b/frontend/public/examples-thumbs/bjt-common-emitter.png differ
diff --git a/frontend/public/examples-thumbs/bjt-common-emitter.webp b/frontend/public/examples-thumbs/bjt-common-emitter.webp
new file mode 100644
index 00000000..dad98213
Binary files /dev/null and b/frontend/public/examples-thumbs/bjt-common-emitter.webp differ
diff --git a/frontend/public/examples-thumbs/blink-led.png b/frontend/public/examples-thumbs/blink-led.png
new file mode 100644
index 00000000..7b6c89bf
Binary files /dev/null and b/frontend/public/examples-thumbs/blink-led.png differ
diff --git a/frontend/public/examples-thumbs/blink-led.webp b/frontend/public/examples-thumbs/blink-led.webp
new file mode 100644
index 00000000..fb3c7827
Binary files /dev/null and b/frontend/public/examples-thumbs/blink-led.webp differ
diff --git a/frontend/public/examples-thumbs/button-led.png b/frontend/public/examples-thumbs/button-led.png
new file mode 100644
index 00000000..d2fe6846
Binary files /dev/null and b/frontend/public/examples-thumbs/button-led.png differ
diff --git a/frontend/public/examples-thumbs/button-led.webp b/frontend/public/examples-thumbs/button-led.webp
new file mode 100644
index 00000000..e5301a88
Binary files /dev/null and b/frontend/public/examples-thumbs/button-led.webp differ
diff --git a/frontend/public/examples-thumbs/c3-blink.png b/frontend/public/examples-thumbs/c3-blink.png
new file mode 100644
index 00000000..f90b2c8f
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-blink.png differ
diff --git a/frontend/public/examples-thumbs/c3-blink.webp b/frontend/public/examples-thumbs/c3-blink.webp
new file mode 100644
index 00000000..ca2f2e7e
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-blink.webp differ
diff --git a/frontend/public/examples-thumbs/c3-button.png b/frontend/public/examples-thumbs/c3-button.png
new file mode 100644
index 00000000..01428a2c
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-button.png differ
diff --git a/frontend/public/examples-thumbs/c3-button.webp b/frontend/public/examples-thumbs/c3-button.webp
new file mode 100644
index 00000000..21d7edfc
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-button.webp differ
diff --git a/frontend/public/examples-thumbs/c3-dht22.png b/frontend/public/examples-thumbs/c3-dht22.png
new file mode 100644
index 00000000..a42c632b
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-dht22.png differ
diff --git a/frontend/public/examples-thumbs/c3-dht22.webp b/frontend/public/examples-thumbs/c3-dht22.webp
new file mode 100644
index 00000000..62a516e9
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-dht22.webp differ
diff --git a/frontend/public/examples-thumbs/c3-hcsr04.png b/frontend/public/examples-thumbs/c3-hcsr04.png
new file mode 100644
index 00000000..3544b206
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-hcsr04.png differ
diff --git a/frontend/public/examples-thumbs/c3-hcsr04.webp b/frontend/public/examples-thumbs/c3-hcsr04.webp
new file mode 100644
index 00000000..017be0bf
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-hcsr04.webp differ
diff --git a/frontend/public/examples-thumbs/c3-pir.png b/frontend/public/examples-thumbs/c3-pir.png
new file mode 100644
index 00000000..3974d82f
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-pir.png differ
diff --git a/frontend/public/examples-thumbs/c3-pir.webp b/frontend/public/examples-thumbs/c3-pir.webp
new file mode 100644
index 00000000..bf020d13
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-pir.webp differ
diff --git a/frontend/public/examples-thumbs/c3-rgb.png b/frontend/public/examples-thumbs/c3-rgb.png
new file mode 100644
index 00000000..59f2b5da
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-rgb.png differ
diff --git a/frontend/public/examples-thumbs/c3-rgb.webp b/frontend/public/examples-thumbs/c3-rgb.webp
new file mode 100644
index 00000000..bcdcb95b
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-rgb.webp differ
diff --git a/frontend/public/examples-thumbs/c3-serial-echo.png b/frontend/public/examples-thumbs/c3-serial-echo.png
new file mode 100644
index 00000000..8c0e94d3
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-serial-echo.png differ
diff --git a/frontend/public/examples-thumbs/c3-serial-echo.webp b/frontend/public/examples-thumbs/c3-serial-echo.webp
new file mode 100644
index 00000000..fb267b96
Binary files /dev/null and b/frontend/public/examples-thumbs/c3-serial-echo.webp differ
diff --git a/frontend/public/examples-thumbs/capacitor-charge-curve.png b/frontend/public/examples-thumbs/capacitor-charge-curve.png
new file mode 100644
index 00000000..2fb99f33
Binary files /dev/null and b/frontend/public/examples-thumbs/capacitor-charge-curve.png differ
diff --git a/frontend/public/examples-thumbs/capacitor-charge-curve.webp b/frontend/public/examples-thumbs/capacitor-charge-curve.webp
new file mode 100644
index 00000000..d038842e
Binary files /dev/null and b/frontend/public/examples-thumbs/capacitor-charge-curve.webp differ
diff --git a/frontend/public/examples-thumbs/darlington-high-current.png b/frontend/public/examples-thumbs/darlington-high-current.png
new file mode 100644
index 00000000..d701a2b4
Binary files /dev/null and b/frontend/public/examples-thumbs/darlington-high-current.png differ
diff --git a/frontend/public/examples-thumbs/darlington-high-current.webp b/frontend/public/examples-thumbs/darlington-high-current.webp
new file mode 100644
index 00000000..ab6f38f5
Binary files /dev/null and b/frontend/public/examples-thumbs/darlington-high-current.webp differ
diff --git a/frontend/public/examples-thumbs/diode-rectifier.png b/frontend/public/examples-thumbs/diode-rectifier.png
new file mode 100644
index 00000000..dd296a85
Binary files /dev/null and b/frontend/public/examples-thumbs/diode-rectifier.png differ
diff --git a/frontend/public/examples-thumbs/diode-rectifier.webp b/frontend/public/examples-thumbs/diode-rectifier.webp
new file mode 100644
index 00000000..09bbaf03
Binary files /dev/null and b/frontend/public/examples-thumbs/diode-rectifier.webp differ
diff --git a/frontend/public/examples-thumbs/dual-pico-bidirectional-handshake.png b/frontend/public/examples-thumbs/dual-pico-bidirectional-handshake.png
new file mode 100644
index 00000000..e2b78967
Binary files /dev/null and b/frontend/public/examples-thumbs/dual-pico-bidirectional-handshake.png differ
diff --git a/frontend/public/examples-thumbs/dual-pico-bidirectional-handshake.webp b/frontend/public/examples-thumbs/dual-pico-bidirectional-handshake.webp
new file mode 100644
index 00000000..dba077e2
Binary files /dev/null and b/frontend/public/examples-thumbs/dual-pico-bidirectional-handshake.webp differ
diff --git a/frontend/public/examples-thumbs/dual-pico-digital-mirror.png b/frontend/public/examples-thumbs/dual-pico-digital-mirror.png
new file mode 100644
index 00000000..6fbbdafa
Binary files /dev/null and b/frontend/public/examples-thumbs/dual-pico-digital-mirror.png differ
diff --git a/frontend/public/examples-thumbs/dual-pico-digital-mirror.webp b/frontend/public/examples-thumbs/dual-pico-digital-mirror.webp
new file mode 100644
index 00000000..a8474dc4
Binary files /dev/null and b/frontend/public/examples-thumbs/dual-pico-digital-mirror.webp differ
diff --git a/frontend/public/examples-thumbs/dual-pico-serial1-passthrough.png b/frontend/public/examples-thumbs/dual-pico-serial1-passthrough.png
new file mode 100644
index 00000000..57024017
Binary files /dev/null and b/frontend/public/examples-thumbs/dual-pico-serial1-passthrough.png differ
diff --git a/frontend/public/examples-thumbs/dual-pico-serial1-passthrough.webp b/frontend/public/examples-thumbs/dual-pico-serial1-passthrough.webp
new file mode 100644
index 00000000..22c0c79a
Binary files /dev/null and b/frontend/public/examples-thumbs/dual-pico-serial1-passthrough.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-7segment.png b/frontend/public/examples-thumbs/esp32-7segment.png
new file mode 100644
index 00000000..6dca3042
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-7segment.png differ
diff --git a/frontend/public/examples-thumbs/esp32-7segment.webp b/frontend/public/examples-thumbs/esp32-7segment.webp
new file mode 100644
index 00000000..9674589b
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-7segment.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-ble-advertise.png b/frontend/public/examples-thumbs/esp32-ble-advertise.png
new file mode 100644
index 00000000..8709ffb5
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-ble-advertise.png differ
diff --git a/frontend/public/examples-thumbs/esp32-ble-advertise.webp b/frontend/public/examples-thumbs/esp32-ble-advertise.webp
new file mode 100644
index 00000000..2bc5bf57
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-ble-advertise.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-bmp280.png b/frontend/public/examples-thumbs/esp32-bmp280.png
new file mode 100644
index 00000000..4a38ee06
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-bmp280.png differ
diff --git a/frontend/public/examples-thumbs/esp32-bmp280.webp b/frontend/public/examples-thumbs/esp32-bmp280.webp
new file mode 100644
index 00000000..a7d4a5fe
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-bmp280.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-dht22.png b/frontend/public/examples-thumbs/esp32-dht22.png
new file mode 100644
index 00000000..72fc41ac
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-dht22.png differ
diff --git a/frontend/public/examples-thumbs/esp32-dht22.webp b/frontend/public/examples-thumbs/esp32-dht22.webp
new file mode 100644
index 00000000..4771222a
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-dht22.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-hcsr04.png b/frontend/public/examples-thumbs/esp32-hcsr04.png
new file mode 100644
index 00000000..7850ec2d
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-hcsr04.png differ
diff --git a/frontend/public/examples-thumbs/esp32-hcsr04.webp b/frontend/public/examples-thumbs/esp32-hcsr04.webp
new file mode 100644
index 00000000..42bfdb75
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-hcsr04.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-http-server.png b/frontend/public/examples-thumbs/esp32-http-server.png
new file mode 100644
index 00000000..8709ffb5
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-http-server.png differ
diff --git a/frontend/public/examples-thumbs/esp32-http-server.webp b/frontend/public/examples-thumbs/esp32-http-server.webp
new file mode 100644
index 00000000..2bc5bf57
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-http-server.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-joystick.png b/frontend/public/examples-thumbs/esp32-joystick.png
new file mode 100644
index 00000000..358404d7
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-joystick.png differ
diff --git a/frontend/public/examples-thumbs/esp32-joystick.webp b/frontend/public/examples-thumbs/esp32-joystick.webp
new file mode 100644
index 00000000..89515622
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-joystick.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-oled.png b/frontend/public/examples-thumbs/esp32-oled.png
new file mode 100644
index 00000000..b2ea6a56
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-oled.png differ
diff --git a/frontend/public/examples-thumbs/esp32-oled.webp b/frontend/public/examples-thumbs/esp32-oled.webp
new file mode 100644
index 00000000..d8b498c9
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-oled.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-pir.png b/frontend/public/examples-thumbs/esp32-pir.png
new file mode 100644
index 00000000..6f911881
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-pir.png differ
diff --git a/frontend/public/examples-thumbs/esp32-pir.webp b/frontend/public/examples-thumbs/esp32-pir.webp
new file mode 100644
index 00000000..97482966
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-pir.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-servo.png b/frontend/public/examples-thumbs/esp32-servo.png
new file mode 100644
index 00000000..102e39db
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-servo.png differ
diff --git a/frontend/public/examples-thumbs/esp32-servo.webp b/frontend/public/examples-thumbs/esp32-servo.webp
new file mode 100644
index 00000000..94a52c6e
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-servo.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-wifi-connect.png b/frontend/public/examples-thumbs/esp32-wifi-connect.png
new file mode 100644
index 00000000..8709ffb5
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-wifi-connect.png differ
diff --git a/frontend/public/examples-thumbs/esp32-wifi-connect.webp b/frontend/public/examples-thumbs/esp32-wifi-connect.webp
new file mode 100644
index 00000000..2bc5bf57
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-wifi-connect.webp differ
diff --git a/frontend/public/examples-thumbs/esp32-wifi-scan.png b/frontend/public/examples-thumbs/esp32-wifi-scan.png
new file mode 100644
index 00000000..8709ffb5
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-wifi-scan.png differ
diff --git a/frontend/public/examples-thumbs/esp32-wifi-scan.webp b/frontend/public/examples-thumbs/esp32-wifi-scan.webp
new file mode 100644
index 00000000..2bc5bf57
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32-wifi-scan.webp differ
diff --git a/frontend/public/examples-thumbs/esp32c3-ble-advertise.png b/frontend/public/examples-thumbs/esp32c3-ble-advertise.png
new file mode 100644
index 00000000..de68e331
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32c3-ble-advertise.png differ
diff --git a/frontend/public/examples-thumbs/esp32c3-ble-advertise.webp b/frontend/public/examples-thumbs/esp32c3-ble-advertise.webp
new file mode 100644
index 00000000..94b027d8
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32c3-ble-advertise.webp differ
diff --git a/frontend/public/examples-thumbs/esp32c3-http-server.png b/frontend/public/examples-thumbs/esp32c3-http-server.png
new file mode 100644
index 00000000..eeda2bd1
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32c3-http-server.png differ
diff --git a/frontend/public/examples-thumbs/esp32c3-http-server.webp b/frontend/public/examples-thumbs/esp32c3-http-server.webp
new file mode 100644
index 00000000..aba7ae3a
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32c3-http-server.webp differ
diff --git a/frontend/public/examples-thumbs/esp32c3-wifi-connect.png b/frontend/public/examples-thumbs/esp32c3-wifi-connect.png
new file mode 100644
index 00000000..efd0350d
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32c3-wifi-connect.png differ
diff --git a/frontend/public/examples-thumbs/esp32c3-wifi-connect.webp b/frontend/public/examples-thumbs/esp32c3-wifi-connect.webp
new file mode 100644
index 00000000..87382c23
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32c3-wifi-connect.webp differ
diff --git a/frontend/public/examples-thumbs/esp32c3-wifi-scan.png b/frontend/public/examples-thumbs/esp32c3-wifi-scan.png
new file mode 100644
index 00000000..9bae07a4
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32c3-wifi-scan.png differ
diff --git a/frontend/public/examples-thumbs/esp32c3-wifi-scan.webp b/frontend/public/examples-thumbs/esp32c3-wifi-scan.webp
new file mode 100644
index 00000000..adc5f3b4
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32c3-wifi-scan.webp differ
diff --git a/frontend/public/examples-thumbs/esp32cam-lcd-preview.png b/frontend/public/examples-thumbs/esp32cam-lcd-preview.png
new file mode 100644
index 00000000..2be20ee8
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32cam-lcd-preview.png differ
diff --git a/frontend/public/examples-thumbs/esp32cam-lcd-preview.webp b/frontend/public/examples-thumbs/esp32cam-lcd-preview.webp
new file mode 100644
index 00000000..7bb133d9
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32cam-lcd-preview.webp differ
diff --git a/frontend/public/examples-thumbs/esp32cam-webcam-demo.png b/frontend/public/examples-thumbs/esp32cam-webcam-demo.png
new file mode 100644
index 00000000..80b35530
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32cam-webcam-demo.png differ
diff --git a/frontend/public/examples-thumbs/esp32cam-webcam-demo.webp b/frontend/public/examples-thumbs/esp32cam-webcam-demo.webp
new file mode 100644
index 00000000..39d2dff2
Binary files /dev/null and b/frontend/public/examples-thumbs/esp32cam-webcam-demo.webp differ
diff --git a/frontend/public/examples-thumbs/fade-led.png b/frontend/public/examples-thumbs/fade-led.png
new file mode 100644
index 00000000..b9207552
Binary files /dev/null and b/frontend/public/examples-thumbs/fade-led.png differ
diff --git a/frontend/public/examples-thumbs/fade-led.webp b/frontend/public/examples-thumbs/fade-led.webp
new file mode 100644
index 00000000..f3c35548
Binary files /dev/null and b/frontend/public/examples-thumbs/fade-led.webp differ
diff --git a/frontend/public/examples-thumbs/i2c-eeprom-rw.png b/frontend/public/examples-thumbs/i2c-eeprom-rw.png
new file mode 100644
index 00000000..17ec631f
Binary files /dev/null and b/frontend/public/examples-thumbs/i2c-eeprom-rw.png differ
diff --git a/frontend/public/examples-thumbs/i2c-eeprom-rw.webp b/frontend/public/examples-thumbs/i2c-eeprom-rw.webp
new file mode 100644
index 00000000..86969929
Binary files /dev/null and b/frontend/public/examples-thumbs/i2c-eeprom-rw.webp differ
diff --git a/frontend/public/examples-thumbs/i2c-rtc-read.png b/frontend/public/examples-thumbs/i2c-rtc-read.png
new file mode 100644
index 00000000..52102854
Binary files /dev/null and b/frontend/public/examples-thumbs/i2c-rtc-read.png differ
diff --git a/frontend/public/examples-thumbs/i2c-rtc-read.webp b/frontend/public/examples-thumbs/i2c-rtc-read.webp
new file mode 100644
index 00000000..00ae6723
Binary files /dev/null and b/frontend/public/examples-thumbs/i2c-rtc-read.webp differ
diff --git a/frontend/public/examples-thumbs/i2c-scanner.png b/frontend/public/examples-thumbs/i2c-scanner.png
new file mode 100644
index 00000000..870e6f84
Binary files /dev/null and b/frontend/public/examples-thumbs/i2c-scanner.png differ
diff --git a/frontend/public/examples-thumbs/i2c-scanner.webp b/frontend/public/examples-thumbs/i2c-scanner.webp
new file mode 100644
index 00000000..808fe69c
Binary files /dev/null and b/frontend/public/examples-thumbs/i2c-scanner.webp differ
diff --git a/frontend/public/examples-thumbs/lcd-hello.png b/frontend/public/examples-thumbs/lcd-hello.png
new file mode 100644
index 00000000..ef842685
Binary files /dev/null and b/frontend/public/examples-thumbs/lcd-hello.png differ
diff --git a/frontend/public/examples-thumbs/lcd-hello.webp b/frontend/public/examples-thumbs/lcd-hello.webp
new file mode 100644
index 00000000..bb2e7ae3
Binary files /dev/null and b/frontend/public/examples-thumbs/lcd-hello.webp differ
diff --git a/frontend/public/examples-thumbs/led-current-limiting.png b/frontend/public/examples-thumbs/led-current-limiting.png
new file mode 100644
index 00000000..fee98bfb
Binary files /dev/null and b/frontend/public/examples-thumbs/led-current-limiting.png differ
diff --git a/frontend/public/examples-thumbs/led-current-limiting.webp b/frontend/public/examples-thumbs/led-current-limiting.webp
new file mode 100644
index 00000000..6347b109
Binary files /dev/null and b/frontend/public/examples-thumbs/led-current-limiting.webp differ
diff --git a/frontend/public/examples-thumbs/mega-blink.png b/frontend/public/examples-thumbs/mega-blink.png
new file mode 100644
index 00000000..5b6f6336
Binary files /dev/null and b/frontend/public/examples-thumbs/mega-blink.png differ
diff --git a/frontend/public/examples-thumbs/mega-blink.webp b/frontend/public/examples-thumbs/mega-blink.webp
new file mode 100644
index 00000000..8f8ecd8a
Binary files /dev/null and b/frontend/public/examples-thumbs/mega-blink.webp differ
diff --git a/frontend/public/examples-thumbs/mega-led-chase.png b/frontend/public/examples-thumbs/mega-led-chase.png
new file mode 100644
index 00000000..ec22a557
Binary files /dev/null and b/frontend/public/examples-thumbs/mega-led-chase.png differ
diff --git a/frontend/public/examples-thumbs/mega-led-chase.webp b/frontend/public/examples-thumbs/mega-led-chase.webp
new file mode 100644
index 00000000..07448b98
Binary files /dev/null and b/frontend/public/examples-thumbs/mega-led-chase.webp differ
diff --git a/frontend/public/examples-thumbs/mega-serial-control.png b/frontend/public/examples-thumbs/mega-serial-control.png
new file mode 100644
index 00000000..a5ef0f48
Binary files /dev/null and b/frontend/public/examples-thumbs/mega-serial-control.png differ
diff --git a/frontend/public/examples-thumbs/mega-serial-control.webp b/frontend/public/examples-thumbs/mega-serial-control.webp
new file mode 100644
index 00000000..fc9d6ae3
Binary files /dev/null and b/frontend/public/examples-thumbs/mega-serial-control.webp differ
diff --git a/frontend/public/examples-thumbs/mega-serial.png b/frontend/public/examples-thumbs/mega-serial.png
new file mode 100644
index 00000000..3c893341
Binary files /dev/null and b/frontend/public/examples-thumbs/mega-serial.png differ
diff --git a/frontend/public/examples-thumbs/mega-serial.webp b/frontend/public/examples-thumbs/mega-serial.webp
new file mode 100644
index 00000000..47abd5b1
Binary files /dev/null and b/frontend/public/examples-thumbs/mega-serial.webp differ
diff --git a/frontend/public/examples-thumbs/mosfet-pwm-led.png b/frontend/public/examples-thumbs/mosfet-pwm-led.png
new file mode 100644
index 00000000..e03e8cd2
Binary files /dev/null and b/frontend/public/examples-thumbs/mosfet-pwm-led.png differ
diff --git a/frontend/public/examples-thumbs/mosfet-pwm-led.webp b/frontend/public/examples-thumbs/mosfet-pwm-led.webp
new file mode 100644
index 00000000..d3eb6035
Binary files /dev/null and b/frontend/public/examples-thumbs/mosfet-pwm-led.webp differ
diff --git a/frontend/public/examples-thumbs/multi-led-bar.png b/frontend/public/examples-thumbs/multi-led-bar.png
new file mode 100644
index 00000000..c56f4525
Binary files /dev/null and b/frontend/public/examples-thumbs/multi-led-bar.png differ
diff --git a/frontend/public/examples-thumbs/multi-led-bar.webp b/frontend/public/examples-thumbs/multi-led-bar.webp
new file mode 100644
index 00000000..cf4384f4
Binary files /dev/null and b/frontend/public/examples-thumbs/multi-led-bar.webp differ
diff --git a/frontend/public/examples-thumbs/multi-protocol.png b/frontend/public/examples-thumbs/multi-protocol.png
new file mode 100644
index 00000000..807e313c
Binary files /dev/null and b/frontend/public/examples-thumbs/multi-protocol.png differ
diff --git a/frontend/public/examples-thumbs/multi-protocol.webp b/frontend/public/examples-thumbs/multi-protocol.webp
new file mode 100644
index 00000000..1627c23d
Binary files /dev/null and b/frontend/public/examples-thumbs/multi-protocol.webp differ
diff --git a/frontend/public/examples-thumbs/nano-serial.png b/frontend/public/examples-thumbs/nano-serial.png
new file mode 100644
index 00000000..d789486c
Binary files /dev/null and b/frontend/public/examples-thumbs/nano-serial.png differ
diff --git a/frontend/public/examples-thumbs/nano-serial.webp b/frontend/public/examples-thumbs/nano-serial.webp
new file mode 100644
index 00000000..b3e5b8fa
Binary files /dev/null and b/frontend/public/examples-thumbs/nano-serial.webp differ
diff --git a/frontend/public/examples-thumbs/npn-led-switch.png b/frontend/public/examples-thumbs/npn-led-switch.png
new file mode 100644
index 00000000..fbc1b126
Binary files /dev/null and b/frontend/public/examples-thumbs/npn-led-switch.png differ
diff --git a/frontend/public/examples-thumbs/npn-led-switch.webp b/frontend/public/examples-thumbs/npn-led-switch.webp
new file mode 100644
index 00000000..0a09ec55
Binary files /dev/null and b/frontend/public/examples-thumbs/npn-led-switch.webp differ
diff --git a/frontend/public/examples-thumbs/ntc-temperature.png b/frontend/public/examples-thumbs/ntc-temperature.png
new file mode 100644
index 00000000..307d0042
Binary files /dev/null and b/frontend/public/examples-thumbs/ntc-temperature.png differ
diff --git a/frontend/public/examples-thumbs/ntc-temperature.webp b/frontend/public/examples-thumbs/ntc-temperature.webp
new file mode 100644
index 00000000..4676ae57
Binary files /dev/null and b/frontend/public/examples-thumbs/ntc-temperature.webp differ
diff --git a/frontend/public/examples-thumbs/opamp-comparator.png b/frontend/public/examples-thumbs/opamp-comparator.png
new file mode 100644
index 00000000..b203101b
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-comparator.png differ
diff --git a/frontend/public/examples-thumbs/opamp-comparator.webp b/frontend/public/examples-thumbs/opamp-comparator.webp
new file mode 100644
index 00000000..e3f514ca
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-comparator.webp differ
diff --git a/frontend/public/examples-thumbs/opamp-difference.png b/frontend/public/examples-thumbs/opamp-difference.png
new file mode 100644
index 00000000..65e2949f
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-difference.png differ
diff --git a/frontend/public/examples-thumbs/opamp-difference.webp b/frontend/public/examples-thumbs/opamp-difference.webp
new file mode 100644
index 00000000..d073723b
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-difference.webp differ
diff --git a/frontend/public/examples-thumbs/opamp-inverting.png b/frontend/public/examples-thumbs/opamp-inverting.png
new file mode 100644
index 00000000..96ee5a28
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-inverting.png differ
diff --git a/frontend/public/examples-thumbs/opamp-inverting.webp b/frontend/public/examples-thumbs/opamp-inverting.webp
new file mode 100644
index 00000000..af364c83
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-inverting.webp differ
diff --git a/frontend/public/examples-thumbs/opamp-schmitt-trigger.png b/frontend/public/examples-thumbs/opamp-schmitt-trigger.png
new file mode 100644
index 00000000..44c46453
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-schmitt-trigger.png differ
diff --git a/frontend/public/examples-thumbs/opamp-schmitt-trigger.webp b/frontend/public/examples-thumbs/opamp-schmitt-trigger.webp
new file mode 100644
index 00000000..03545826
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-schmitt-trigger.webp differ
diff --git a/frontend/public/examples-thumbs/opamp-voltage-follower.png b/frontend/public/examples-thumbs/opamp-voltage-follower.png
new file mode 100644
index 00000000..4dc0bd56
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-voltage-follower.png differ
diff --git a/frontend/public/examples-thumbs/opamp-voltage-follower.webp b/frontend/public/examples-thumbs/opamp-voltage-follower.webp
new file mode 100644
index 00000000..e4a37ede
Binary files /dev/null and b/frontend/public/examples-thumbs/opamp-voltage-follower.webp differ
diff --git a/frontend/public/examples-thumbs/parallel-resistors.png b/frontend/public/examples-thumbs/parallel-resistors.png
new file mode 100644
index 00000000..3ee0e4c3
Binary files /dev/null and b/frontend/public/examples-thumbs/parallel-resistors.png differ
diff --git a/frontend/public/examples-thumbs/parallel-resistors.webp b/frontend/public/examples-thumbs/parallel-resistors.webp
new file mode 100644
index 00000000..2a6411e7
Binary files /dev/null and b/frontend/public/examples-thumbs/parallel-resistors.webp differ
diff --git a/frontend/public/examples-thumbs/photoresistor-light.png b/frontend/public/examples-thumbs/photoresistor-light.png
new file mode 100644
index 00000000..b4de5ba1
Binary files /dev/null and b/frontend/public/examples-thumbs/photoresistor-light.png differ
diff --git a/frontend/public/examples-thumbs/photoresistor-light.webp b/frontend/public/examples-thumbs/photoresistor-light.webp
new file mode 100644
index 00000000..7dc1dc7d
Binary files /dev/null and b/frontend/public/examples-thumbs/photoresistor-light.webp differ
diff --git a/frontend/public/examples-thumbs/pi-to-arduino-led-control.png b/frontend/public/examples-thumbs/pi-to-arduino-led-control.png
new file mode 100644
index 00000000..d7c81eb9
Binary files /dev/null and b/frontend/public/examples-thumbs/pi-to-arduino-led-control.png differ
diff --git a/frontend/public/examples-thumbs/pi-to-arduino-led-control.webp b/frontend/public/examples-thumbs/pi-to-arduino-led-control.webp
new file mode 100644
index 00000000..aecd0209
Binary files /dev/null and b/frontend/public/examples-thumbs/pi-to-arduino-led-control.webp differ
diff --git a/frontend/public/examples-thumbs/pico-7segment.png b/frontend/public/examples-thumbs/pico-7segment.png
new file mode 100644
index 00000000..89d2c917
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-7segment.png differ
diff --git a/frontend/public/examples-thumbs/pico-7segment.webp b/frontend/public/examples-thumbs/pico-7segment.webp
new file mode 100644
index 00000000..a246bebd
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-7segment.webp differ
diff --git a/frontend/public/examples-thumbs/pico-adc-read.png b/frontend/public/examples-thumbs/pico-adc-read.png
new file mode 100644
index 00000000..c8e98587
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-adc-read.png differ
diff --git a/frontend/public/examples-thumbs/pico-adc-read.webp b/frontend/public/examples-thumbs/pico-adc-read.webp
new file mode 100644
index 00000000..36f837f2
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-adc-read.webp differ
diff --git a/frontend/public/examples-thumbs/pico-blink.png b/frontend/public/examples-thumbs/pico-blink.png
new file mode 100644
index 00000000..5a08f5bc
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-blink.png differ
diff --git a/frontend/public/examples-thumbs/pico-blink.webp b/frontend/public/examples-thumbs/pico-blink.webp
new file mode 100644
index 00000000..eb03e232
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-blink.webp differ
diff --git a/frontend/public/examples-thumbs/pico-button-led.png b/frontend/public/examples-thumbs/pico-button-led.png
new file mode 100644
index 00000000..408e26f4
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-button-led.png differ
diff --git a/frontend/public/examples-thumbs/pico-button-led.webp b/frontend/public/examples-thumbs/pico-button-led.webp
new file mode 100644
index 00000000..31d0e27f
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-button-led.webp differ
diff --git a/frontend/public/examples-thumbs/pico-dht22.png b/frontend/public/examples-thumbs/pico-dht22.png
new file mode 100644
index 00000000..a9d9c7f8
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-dht22.png differ
diff --git a/frontend/public/examples-thumbs/pico-dht22.webp b/frontend/public/examples-thumbs/pico-dht22.webp
new file mode 100644
index 00000000..382356c7
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-dht22.webp differ
diff --git a/frontend/public/examples-thumbs/pico-hcsr04.png b/frontend/public/examples-thumbs/pico-hcsr04.png
new file mode 100644
index 00000000..53709806
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-hcsr04.png differ
diff --git a/frontend/public/examples-thumbs/pico-hcsr04.webp b/frontend/public/examples-thumbs/pico-hcsr04.webp
new file mode 100644
index 00000000..151f7ecb
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-hcsr04.webp differ
diff --git a/frontend/public/examples-thumbs/pico-i2c-eeprom-rw.png b/frontend/public/examples-thumbs/pico-i2c-eeprom-rw.png
new file mode 100644
index 00000000..8f70cc01
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-i2c-eeprom-rw.png differ
diff --git a/frontend/public/examples-thumbs/pico-i2c-eeprom-rw.webp b/frontend/public/examples-thumbs/pico-i2c-eeprom-rw.webp
new file mode 100644
index 00000000..b060b8a1
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-i2c-eeprom-rw.webp differ
diff --git a/frontend/public/examples-thumbs/pico-i2c-rtc-read.png b/frontend/public/examples-thumbs/pico-i2c-rtc-read.png
new file mode 100644
index 00000000..eb70e143
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-i2c-rtc-read.png differ
diff --git a/frontend/public/examples-thumbs/pico-i2c-rtc-read.webp b/frontend/public/examples-thumbs/pico-i2c-rtc-read.webp
new file mode 100644
index 00000000..f4f92fca
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-i2c-rtc-read.webp differ
diff --git a/frontend/public/examples-thumbs/pico-i2c-scanner.png b/frontend/public/examples-thumbs/pico-i2c-scanner.png
new file mode 100644
index 00000000..e67ccac5
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-i2c-scanner.png differ
diff --git a/frontend/public/examples-thumbs/pico-i2c-scanner.webp b/frontend/public/examples-thumbs/pico-i2c-scanner.webp
new file mode 100644
index 00000000..1d27ffbb
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-i2c-scanner.webp differ
diff --git a/frontend/public/examples-thumbs/pico-joystick.png b/frontend/public/examples-thumbs/pico-joystick.png
new file mode 100644
index 00000000..5b62f295
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-joystick.png differ
diff --git a/frontend/public/examples-thumbs/pico-joystick.webp b/frontend/public/examples-thumbs/pico-joystick.webp
new file mode 100644
index 00000000..624e270f
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-joystick.webp differ
diff --git a/frontend/public/examples-thumbs/pico-ntc.png b/frontend/public/examples-thumbs/pico-ntc.png
new file mode 100644
index 00000000..12dd51b7
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-ntc.png differ
diff --git a/frontend/public/examples-thumbs/pico-ntc.webp b/frontend/public/examples-thumbs/pico-ntc.webp
new file mode 100644
index 00000000..7504a417
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-ntc.webp differ
diff --git a/frontend/public/examples-thumbs/pico-pir.png b/frontend/public/examples-thumbs/pico-pir.png
new file mode 100644
index 00000000..92dc3958
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-pir.png differ
diff --git a/frontend/public/examples-thumbs/pico-pir.webp b/frontend/public/examples-thumbs/pico-pir.webp
new file mode 100644
index 00000000..3f32e358
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-pir.webp differ
diff --git a/frontend/public/examples-thumbs/pico-rgb.png b/frontend/public/examples-thumbs/pico-rgb.png
new file mode 100644
index 00000000..2142bafb
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-rgb.png differ
diff --git a/frontend/public/examples-thumbs/pico-rgb.webp b/frontend/public/examples-thumbs/pico-rgb.webp
new file mode 100644
index 00000000..ae35d47d
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-rgb.webp differ
diff --git a/frontend/public/examples-thumbs/pico-serial-echo.png b/frontend/public/examples-thumbs/pico-serial-echo.png
new file mode 100644
index 00000000..a9bf4fbf
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-serial-echo.png differ
diff --git a/frontend/public/examples-thumbs/pico-serial-echo.webp b/frontend/public/examples-thumbs/pico-serial-echo.webp
new file mode 100644
index 00000000..b2a5113b
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-serial-echo.webp differ
diff --git a/frontend/public/examples-thumbs/pico-serial-led-control.png b/frontend/public/examples-thumbs/pico-serial-led-control.png
new file mode 100644
index 00000000..60fe7604
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-serial-led-control.png differ
diff --git a/frontend/public/examples-thumbs/pico-serial-led-control.webp b/frontend/public/examples-thumbs/pico-serial-led-control.webp
new file mode 100644
index 00000000..4b1c317e
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-serial-led-control.webp differ
diff --git a/frontend/public/examples-thumbs/pico-servo.png b/frontend/public/examples-thumbs/pico-servo.png
new file mode 100644
index 00000000..5d5c56e1
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-servo.png differ
diff --git a/frontend/public/examples-thumbs/pico-servo.webp b/frontend/public/examples-thumbs/pico-servo.webp
new file mode 100644
index 00000000..3e6037ed
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-servo.webp differ
diff --git a/frontend/public/examples-thumbs/pico-spi-loopback.png b/frontend/public/examples-thumbs/pico-spi-loopback.png
new file mode 100644
index 00000000..f54e2c49
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-spi-loopback.png differ
diff --git a/frontend/public/examples-thumbs/pico-spi-loopback.webp b/frontend/public/examples-thumbs/pico-spi-loopback.webp
new file mode 100644
index 00000000..b3b84496
Binary files /dev/null and b/frontend/public/examples-thumbs/pico-spi-loopback.webp differ
diff --git a/frontend/public/examples-thumbs/pnp-high-side-switch.png b/frontend/public/examples-thumbs/pnp-high-side-switch.png
new file mode 100644
index 00000000..a082eed7
Binary files /dev/null and b/frontend/public/examples-thumbs/pnp-high-side-switch.png differ
diff --git a/frontend/public/examples-thumbs/pnp-high-side-switch.webp b/frontend/public/examples-thumbs/pnp-high-side-switch.webp
new file mode 100644
index 00000000..f2f87ec8
Binary files /dev/null and b/frontend/public/examples-thumbs/pnp-high-side-switch.webp differ
diff --git a/frontend/public/examples-thumbs/pot-adc-reader.png b/frontend/public/examples-thumbs/pot-adc-reader.png
new file mode 100644
index 00000000..c96df5f1
Binary files /dev/null and b/frontend/public/examples-thumbs/pot-adc-reader.png differ
diff --git a/frontend/public/examples-thumbs/pot-adc-reader.webp b/frontend/public/examples-thumbs/pot-adc-reader.webp
new file mode 100644
index 00000000..1d31c762
Binary files /dev/null and b/frontend/public/examples-thumbs/pot-adc-reader.webp differ
diff --git a/frontend/public/examples-thumbs/rc-low-pass-filter.png b/frontend/public/examples-thumbs/rc-low-pass-filter.png
new file mode 100644
index 00000000..411ca7e3
Binary files /dev/null and b/frontend/public/examples-thumbs/rc-low-pass-filter.png differ
diff --git a/frontend/public/examples-thumbs/rc-low-pass-filter.webp b/frontend/public/examples-thumbs/rc-low-pass-filter.webp
new file mode 100644
index 00000000..2949285c
Binary files /dev/null and b/frontend/public/examples-thumbs/rc-low-pass-filter.webp differ
diff --git a/frontend/public/examples-thumbs/rgb-led.png b/frontend/public/examples-thumbs/rgb-led.png
new file mode 100644
index 00000000..fbea2501
Binary files /dev/null and b/frontend/public/examples-thumbs/rgb-led.png differ
diff --git a/frontend/public/examples-thumbs/rgb-led.webp b/frontend/public/examples-thumbs/rgb-led.webp
new file mode 100644
index 00000000..b5182522
Binary files /dev/null and b/frontend/public/examples-thumbs/rgb-led.webp differ
diff --git a/frontend/public/examples-thumbs/schottky-reverse-protection.png b/frontend/public/examples-thumbs/schottky-reverse-protection.png
new file mode 100644
index 00000000..a2b05913
Binary files /dev/null and b/frontend/public/examples-thumbs/schottky-reverse-protection.png differ
diff --git a/frontend/public/examples-thumbs/schottky-reverse-protection.webp b/frontend/public/examples-thumbs/schottky-reverse-protection.webp
new file mode 100644
index 00000000..15e13b29
Binary files /dev/null and b/frontend/public/examples-thumbs/schottky-reverse-protection.webp differ
diff --git a/frontend/public/examples-thumbs/serial-echo.png b/frontend/public/examples-thumbs/serial-echo.png
new file mode 100644
index 00000000..e4b0a4fe
Binary files /dev/null and b/frontend/public/examples-thumbs/serial-echo.png differ
diff --git a/frontend/public/examples-thumbs/serial-echo.webp b/frontend/public/examples-thumbs/serial-echo.webp
new file mode 100644
index 00000000..204d2274
Binary files /dev/null and b/frontend/public/examples-thumbs/serial-echo.webp differ
diff --git a/frontend/public/examples-thumbs/serial-hello.png b/frontend/public/examples-thumbs/serial-hello.png
new file mode 100644
index 00000000..caaa3990
Binary files /dev/null and b/frontend/public/examples-thumbs/serial-hello.png differ
diff --git a/frontend/public/examples-thumbs/serial-hello.webp b/frontend/public/examples-thumbs/serial-hello.webp
new file mode 100644
index 00000000..5e79a48c
Binary files /dev/null and b/frontend/public/examples-thumbs/serial-hello.webp differ
diff --git a/frontend/public/examples-thumbs/serial-led-control.png b/frontend/public/examples-thumbs/serial-led-control.png
new file mode 100644
index 00000000..8e673a0f
Binary files /dev/null and b/frontend/public/examples-thumbs/serial-led-control.png differ
diff --git a/frontend/public/examples-thumbs/serial-led-control.webp b/frontend/public/examples-thumbs/serial-led-control.webp
new file mode 100644
index 00000000..538605c7
Binary files /dev/null and b/frontend/public/examples-thumbs/serial-led-control.webp differ
diff --git a/frontend/public/examples-thumbs/simon-says.png b/frontend/public/examples-thumbs/simon-says.png
new file mode 100644
index 00000000..b0f2fac5
Binary files /dev/null and b/frontend/public/examples-thumbs/simon-says.png differ
diff --git a/frontend/public/examples-thumbs/simon-says.webp b/frontend/public/examples-thumbs/simon-says.webp
new file mode 100644
index 00000000..d348dd33
Binary files /dev/null and b/frontend/public/examples-thumbs/simon-says.webp differ
diff --git a/frontend/public/examples-thumbs/spi-loopback.png b/frontend/public/examples-thumbs/spi-loopback.png
new file mode 100644
index 00000000..4882d95b
Binary files /dev/null and b/frontend/public/examples-thumbs/spi-loopback.png differ
diff --git a/frontend/public/examples-thumbs/spi-loopback.webp b/frontend/public/examples-thumbs/spi-loopback.webp
new file mode 100644
index 00000000..0d6b70dd
Binary files /dev/null and b/frontend/public/examples-thumbs/spi-loopback.webp differ
diff --git a/frontend/public/examples-thumbs/traffic-light.png b/frontend/public/examples-thumbs/traffic-light.png
new file mode 100644
index 00000000..83524d78
Binary files /dev/null and b/frontend/public/examples-thumbs/traffic-light.png differ
diff --git a/frontend/public/examples-thumbs/traffic-light.webp b/frontend/public/examples-thumbs/traffic-light.webp
new file mode 100644
index 00000000..a5c12509
Binary files /dev/null and b/frontend/public/examples-thumbs/traffic-light.webp differ
diff --git a/frontend/public/examples-thumbs/uno-7segment.png b/frontend/public/examples-thumbs/uno-7segment.png
new file mode 100644
index 00000000..d70f7deb
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-7segment.png differ
diff --git a/frontend/public/examples-thumbs/uno-7segment.webp b/frontend/public/examples-thumbs/uno-7segment.webp
new file mode 100644
index 00000000..756dff8b
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-7segment.webp differ
diff --git a/frontend/public/examples-thumbs/uno-dht22.png b/frontend/public/examples-thumbs/uno-dht22.png
new file mode 100644
index 00000000..efcfa981
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-dht22.png differ
diff --git a/frontend/public/examples-thumbs/uno-dht22.webp b/frontend/public/examples-thumbs/uno-dht22.webp
new file mode 100644
index 00000000..ed8bda17
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-dht22.webp differ
diff --git a/frontend/public/examples-thumbs/uno-hcsr04.png b/frontend/public/examples-thumbs/uno-hcsr04.png
new file mode 100644
index 00000000..53d84a5c
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-hcsr04.png differ
diff --git a/frontend/public/examples-thumbs/uno-hcsr04.webp b/frontend/public/examples-thumbs/uno-hcsr04.webp
new file mode 100644
index 00000000..58be4e9c
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-hcsr04.webp differ
diff --git a/frontend/public/examples-thumbs/uno-ntc.png b/frontend/public/examples-thumbs/uno-ntc.png
new file mode 100644
index 00000000..e9dee830
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-ntc.png differ
diff --git a/frontend/public/examples-thumbs/uno-ntc.webp b/frontend/public/examples-thumbs/uno-ntc.webp
new file mode 100644
index 00000000..c4f48bf0
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-ntc.webp differ
diff --git a/frontend/public/examples-thumbs/uno-photoresistor.png b/frontend/public/examples-thumbs/uno-photoresistor.png
new file mode 100644
index 00000000..98b609e1
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-photoresistor.png differ
diff --git a/frontend/public/examples-thumbs/uno-photoresistor.webp b/frontend/public/examples-thumbs/uno-photoresistor.webp
new file mode 100644
index 00000000..08035a9f
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-photoresistor.webp differ
diff --git a/frontend/public/examples-thumbs/uno-pir.png b/frontend/public/examples-thumbs/uno-pir.png
new file mode 100644
index 00000000..ab935bcb
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-pir.png differ
diff --git a/frontend/public/examples-thumbs/uno-pir.webp b/frontend/public/examples-thumbs/uno-pir.webp
new file mode 100644
index 00000000..367039b7
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-pir.webp differ
diff --git a/frontend/public/examples-thumbs/uno-potentiometer.png b/frontend/public/examples-thumbs/uno-potentiometer.png
new file mode 100644
index 00000000..8d14688b
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-potentiometer.png differ
diff --git a/frontend/public/examples-thumbs/uno-potentiometer.webp b/frontend/public/examples-thumbs/uno-potentiometer.webp
new file mode 100644
index 00000000..26d10390
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-potentiometer.webp differ
diff --git a/frontend/public/examples-thumbs/uno-rgb-cycle.png b/frontend/public/examples-thumbs/uno-rgb-cycle.png
new file mode 100644
index 00000000..b1327735
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-rgb-cycle.png differ
diff --git a/frontend/public/examples-thumbs/uno-rgb-cycle.webp b/frontend/public/examples-thumbs/uno-rgb-cycle.webp
new file mode 100644
index 00000000..52a5f38a
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-rgb-cycle.webp differ
diff --git a/frontend/public/examples-thumbs/uno-servo.png b/frontend/public/examples-thumbs/uno-servo.png
new file mode 100644
index 00000000..32df9515
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-servo.png differ
diff --git a/frontend/public/examples-thumbs/uno-servo.webp b/frontend/public/examples-thumbs/uno-servo.webp
new file mode 100644
index 00000000..9ea39c92
Binary files /dev/null and b/frontend/public/examples-thumbs/uno-servo.webp differ
diff --git a/frontend/public/examples-thumbs/voltage-divider.png b/frontend/public/examples-thumbs/voltage-divider.png
new file mode 100644
index 00000000..128c8bd0
Binary files /dev/null and b/frontend/public/examples-thumbs/voltage-divider.png differ
diff --git a/frontend/public/examples-thumbs/voltage-divider.webp b/frontend/public/examples-thumbs/voltage-divider.webp
new file mode 100644
index 00000000..19ae6200
Binary files /dev/null and b/frontend/public/examples-thumbs/voltage-divider.webp differ
diff --git a/frontend/public/examples-thumbs/wheatstone-bridge.png b/frontend/public/examples-thumbs/wheatstone-bridge.png
new file mode 100644
index 00000000..43034821
Binary files /dev/null and b/frontend/public/examples-thumbs/wheatstone-bridge.png differ
diff --git a/frontend/public/examples-thumbs/wheatstone-bridge.webp b/frontend/public/examples-thumbs/wheatstone-bridge.webp
new file mode 100644
index 00000000..cb5667e6
Binary files /dev/null and b/frontend/public/examples-thumbs/wheatstone-bridge.webp differ
diff --git a/frontend/public/examples-thumbs/zener-regulator.png b/frontend/public/examples-thumbs/zener-regulator.png
new file mode 100644
index 00000000..abbbf545
Binary files /dev/null and b/frontend/public/examples-thumbs/zener-regulator.png differ
diff --git a/frontend/public/examples-thumbs/zener-regulator.webp b/frontend/public/examples-thumbs/zener-regulator.webp
new file mode 100644
index 00000000..277a009b
Binary files /dev/null and b/frontend/public/examples-thumbs/zener-regulator.webp differ
diff --git a/frontend/src/components/examples/ExampleThumbnail.tsx b/frontend/src/components/examples/ExampleThumbnail.tsx
new file mode 100644
index 00000000..3c9a4840
--- /dev/null
+++ b/frontend/src/components/examples/ExampleThumbnail.tsx
@@ -0,0 +1,75 @@
+/**
+ * ExampleThumbnail — convention-based card thumbnail for an example.
+ *
+ *   1. Try /examples-thumbs/<id>.{webp,png} (real canvas screenshot,
+ *      generated by velxio-prod's scripts/capture-example-thumbs.mjs).
+ *   2. If that 404s — or if the example has no thumbnail file yet — fall
+ *      back to the existing CircuitPreview component (the SVG/wire mock).
+ *
+ * The optional `example.thumbnail` field still wins if explicitly set.
+ */
+
+import { useState } from 'react';
+import type { CSSProperties } from 'react';
+import type { ExampleProject } from '../../data/examples';
+import { CircuitPreview } from './CircuitPreview';
+
+interface Props {
+  example: ExampleProject;
+  width?: number;
+  height?: number;
+  background?: string;
+  style?: CSSProperties;
+}
+
+export const ExampleThumbnail = ({
+  example,
+  width = 300,
+  height = 180,
+  background = '#0a0a0c',
+  style,
+}: Props) => {
+  const [imgFailed, setImgFailed] = useState(false);
+
+  // Explicit thumbnail wins over convention-based.
+  if (example.thumbnail) {
+    return (
+      <img
+        src={example.thumbnail}
+        alt={example.title}
+        className="example-preview-image"
+        style={style}
+        loading="lazy"
+      />
+    );
+  }
+
+  if (imgFailed) {
+    return (
+      <CircuitPreview
+        example={example}
+        width={width}
+        height={height}
+        background={background}
+        style={style}
+      />
+    );
+  }
+
+  return (
+    <picture>
+      <source
+        type="image/webp"
+        srcSet={`/examples-thumbs/${example.id}.webp`}
+      />
+      <img
+        src={`/examples-thumbs/${example.id}.png`}
+        alt={example.title}
+        className="example-preview-image"
+        style={style}
+        loading="lazy"
+        onError={() => setImgFailed(true)}
+      />
+    </picture>
+  );
+};
diff --git a/frontend/src/components/examples/ExamplesGallery.tsx b/frontend/src/components/examples/ExamplesGallery.tsx
index 2ebf27c5..872d3dfc 100644
--- a/frontend/src/components/examples/ExamplesGallery.tsx
+++ b/frontend/src/components/examples/ExamplesGallery.tsx
@@ -6,7 +6,7 @@
 
 import React, { useState, useCallback } from 'react';
 import { exampleProjects, type ExampleProject } from '../../data/examples';
-import { CircuitPreview } from './CircuitPreview';
+import { ExampleThumbnail } from './ExampleThumbnail';
 import './ExamplesGallery.css';
 
 interface ExamplesGalleryProps {
@@ -316,21 +316,13 @@ export const ExamplesGallery: React.FC<ExamplesGalleryProps> = ({ onLoadExample
           return (
             <div key={example.id} className="example-card" onClick={() => onLoadExample(example)}>
               <div className="example-thumbnail">
-                {example.thumbnail ? (
-                  <img
-                    src={example.thumbnail}
-                    alt={example.title}
-                    className="example-preview-image"
-                  />
-                ) : (
-                  <CircuitPreview
-                    example={example}
-                    width={300}
-                    height={180}
-                    background="#0a0a0c"
-                    style={{ width: '100%', height: '100%' }}
-                  />
-                )}
+                <ExampleThumbnail
+                  example={example}
+                  width={300}
+                  height={180}
+                  background="#0a0a0c"
+                  style={{ width: '100%', height: '100%' }}
+                />
               </div>
               <div className="example-info">
                 <h3 className="example-title">{example.title}</h3>
diff --git a/frontend/src/pages/ExampleDetailPage.tsx b/frontend/src/pages/ExampleDetailPage.tsx
index ae730b6e..ddddeafa 100644
--- a/frontend/src/pages/ExampleDetailPage.tsx
+++ b/frontend/src/pages/ExampleDetailPage.tsx
@@ -14,7 +14,7 @@ import { useParams, useNavigate, Link } from 'react-router-dom';
 import { exampleProjects } from '../data/examples';
 import { loadExample, type LibraryInstallProgress } from '../utils/loadExample';
 import { AppHeader } from '../components/layout/AppHeader';
-import { CircuitPreview } from '../components/examples/CircuitPreview';
+import { ExampleThumbnail } from '../components/examples/ExampleThumbnail';
 import { useSEO } from '../utils/useSEO';
 
 const DOMAIN = 'https://velxio.dev';
@@ -176,7 +176,7 @@ export const ExampleDetailPage: React.FC = () => {
               border: '1px solid #333',
             }}
           >
-            <CircuitPreview
+            <ExampleThumbnail
               example={example}
               width={760}
               height={240}