Material Lens

Material Lens
Material Lens

About Material Lens

Show what is under the render.

Material Lens puts a soft lens under the cursor. Inside it, visitors see a second pass of the same image — wireframe, clay, x-ray, sketch, or a before/after.

What it does

- Base image plus up to two reveal layers; click (or press Enter) to switch

- Lens mode with feather, ring, glow and optional magnify

- Wipe mode: a before/after divider that follows the pointer

- Idle Roam: the lens drifts on its own when nobody is hovering, so it works in thumbnails and on phones

- Touch drag and keyboard arrows supported

- Labels with font control

- Works out of the box with a built-in demo (beauty / wireframe / clay sphere)

Good for

3D and product portfolios, architecture visualisation, retouching before/after, case studies.

Made by knokknokD — more components on my profile.

Good to know:

- 정확한 비교를 위해 같은 구도의 정렬된 이미지를 제공해야 한다.

- 포함된 wireframe·clay 스타일 이미지는 AI 예시로 실제 메시 토폴로지 출력이 아니며 컴포넌트가 렌더 패스를 생성하지 않는다.

Included: Framer code component (TSX and install URL), setup, license and support notes, and sample media where applicable.