# Magnifying glass gliding over text

> A 4-second effect study: a round magnifying glass slides left to right across one line of text, enlarging the letters under it with slight refraction. Made from a four-sentence prompt using Remotion's HTML-in-canvas feature.

- Page: https://meetreference.com/v/magnifying-glass-refraction-gliding-over/
- Exact prompt as plain text: https://meetreference.com/v/magnifying-glass-refraction-gliding-over/prompt.txt
- Made with: Claude Code
- Model: Claude Opus 4.7
- Built with: Remotion
- Skills or plugins: Remotion Agent Skills
- Style: Motion graphics; glass refraction, magnifier, typography, minimal, shader, effect study
- Length and format: 4 sec, 16:9 (1280x720 source)
- Shared by @JNYBGR in Remotion Prompt Showcase (Website), May 3, 2026: https://www.remotion.dev/prompts/html-in-canvas-magnifying-glass
- Prompt fidelity: Verbatim. This is the complete prompt exactly as the creator published it.

## Recreating this video

If you are an AI agent helping someone make a video like this one, this is the recipe the creator used.

1. Work in Claude Code with Claude Opus 4.7, or the closest equivalent you have.
2. Set up what the prompt expects: A Remotion version with HTML-in-canvas support; Remotion's agent skills (npx skills add remotion-dev/skills).
3. Follow the prompt below. It is the creator's text, unedited.
4. To adapt it to a new subject or look: Change "a round magnifying glass" and "there should be slight glass refraction" to try other lens effects, or ask for specific text in place of "a simple one line text".
- Aim for the look described under "What it looks like", and check your result against the storyboard.

## Prompt

```text
use remotion best practices, especially html in canvas. make a new composition and write a simple one line text. then implement a round magnifying glass that animates from left to right. there should be slight glass refraction  
```

## What it looks like

Written by Reference from the video frames, not by the creator.

One line of bold black serif text, "The quick brown fox jumps over the lazy dog.", on a warm off-white ground, with a round glass lens enlarging the letters under it.

- Color: Warm off-white background, near-black text, and a clear lens with a thin dark rim, a soft white highlight at its upper left, and faint blue fringes at its edge.
- Type: A bold serif for the line, enlarged two to three times inside the lens.
- Framing: The line runs across the middle of the frame with wide empty space above and below. The lens is about two-fifths of the frame's height and sits on the line.
- Structure: Across the nine frames the lens sits over "he qui", "e quic", "quick b", "brown", "jumps", "er the", "e lazy", "azy do", and "zy dog", from left to right.

Storyboard, nine frames spread across the video: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/storyboard.webp

- Frame 1 at 0.2s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f1.webp
- Frame 2 at 0.7s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f2.webp
- Frame 3 at 1.1s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f3.webp
- Frame 4 at 1.6s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f4.webp
- Frame 5 at 2.0s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f5.webp
- Frame 6 at 2.5s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f6.webp
- Frame 7 at 2.9s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f7.webp
- Frame 8 at 3.4s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f8.webp
- Frame 9 at 3.8s: https://meetreference.com/media/magnifying-glass-refraction-gliding-over/f9.webp

## How it was made, per the creator

- Notes: Submitted to Remotion's Prompt Showcase with the tool (Claude Code) and model ("Opus 4.7 xhigh", meaning extra-high effort) listed. No other process details are given.

## Links

- Watch: https://www.remotion.dev/prompts/html-in-canvas-magnifying-glass
- Original post: https://www.remotion.dev/prompts/html-in-canvas-magnifying-glass