# Magnifier using Three.js and react fiber

**URL:** <https://discourse.threejs.org/t/magnifier-using-three-js-and-react-fiber/76724>\
**Category:** Questions\
**Tags:** post-processing\
**Created:** [January 19, 2025, 6:04am UTC](https://discourse.threejs.org/t/magnifier-using-three-js-and-react-fiber/76724 "2025-01-19T06:04:49Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![amo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/amo/32/45580_2.png) [@amo](https://discourse.threejs.org/u/amo)\
**Post date:** [January 19, 2025, 6:04am UTC](https://discourse.threejs.org/t/magnifier-using-three-js-and-react-fiber/76724/1 "2025-01-19T06:04:49Z")

</div>

Hi,

How to apply a magnifier effect to a scene with three fiber ? I saw some stuff in this channel and this : [https://codepen.io/strangerintheq/pen/VNMbOV](https://codepen.io/strangerintheq/pen/VNMbOV) but it is with normal three.js. Here’s what I have made with EffectComposer, shaderPass (and IA), there is no bug but I can’s see the effect : [https://eg-2telmuuvf-amaurypichats-projects.vercel.app/](https://eg-2telmuuvf-amaurypichats-projects.vercel.app/)

What is the meta for this currently ? Thank you.

---

<div class="post-metadata">

**Author:** ![manthrax](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/manthrax/32/2596_2.png) [@manthrax](https://discourse.threejs.org/u/manthrax)\
**Post date:** [January 19, 2025, 8:43am UTC](https://discourse.threejs.org/t/magnifier-using-three-js-and-react-fiber/76724/2 "2025-01-19T08:43:39Z")

</div>

I made a magnifying lens with meshphysicalmaterial before. Iirc it just worked out of the box if you set the thickness params.

If you need more like… a camera zoom… you can animate the camera.fov followed by camera .updateProjectionMatrix()

edit: oh i see u want r3f… is this [Fisheye camera (tested with Bruno Simons Level1) + code](https://discourse.threejs.org/t/fisheye-camera-tested-with-bruno-simons-level1-code/56787) relevant ?