Free Video Effect
Green Screen Effect: Stand in Front of Your App Without a Green Screen
Your room disappears and you stand in front of a colour gradient and a large, live app screen.
Claude Code · Opus 5.59:16Medium
- Run the setup once
- Paste the prompt, fill in the [brackets]
- Approve the preview, get your MP4
New to Claude Code? Start with the beginner guide →
Want all 17 at once? Get the full pack →
The prompt
effects/green_screen.py: add a "Green Screen" effect between [START S] and [END S].
- Separate me from the background with the person mask; no green/color spill on the edges,
keep the hair edges soft.
- New background: a vertical gradient from top to bottom, [COLOR 1, e.g. #6A2CF5] → [COLOR 2, e.g. #3B1FA8],
with a very light grain.
- In the middle of the background, put a big app screen designed in HTML:
[SCREEN DESCRIPTION, e.g. a "Focus mode" app: a 49:57 timer at the top and the task
"Write the sales page", the other tasks locked below it,
the serif italic text "The rest can wait." in the middle, a message box at the bottom]
- I stand IN FRONT of this screen, in the bottom half (scaled down to about 60%).
- The timer on the screen counts down in real time; "[TEXT]" is typed into the message box letter by letter,
and the mouse cursor moves to the send button.
- The accent word of the captions appears as a white label on a black background.
- Add a very light rim light to me in the background's color, so I don't look pasted on.Fill in the brackets
| Placeholder | What to put there | Example |
|---|---|---|
[START S] / [END S] | Where the effect starts and ends, in seconds from the start of input.mp4. | 5.5 / 12.0 |
[COLOR 1, e.g. #6A2CF5] / [COLOR 2, e.g. #3B1FA8] | The top and bottom colours of the background gradient, as hex codes. | #6A2CF5 / #3B1FA8 |
[SCREEN DESCRIPTION] | A plain-English description of the app screen Claude designs in HTML: what app it is, the key text and numbers, and where each element sits. | A 'Focus mode' app with a 49:57 timer and the task 'Write the sales page' |
[TEXT] | The text that types itself into the screen's message box, letter by letter. | Draft the intro for me |
About Green Screen
Green Screen is a talking-head video effect that removes your real background with a person mask, no green cloth needed, and puts you in front of a colour gradient and a large app screen with a live timer and typing. After the one-time setup, paste the prompt below into Claude Code with Opus 5.5 and describe the screen you want.
Use it when: You introduce a product, a page or an interface.
What the Green Screen effect does
Green Screen swaps your room for a designed backdrop, with no green fabric involved. Claude uses the person mask from setup to lift you out of the frame, fills the background with a vertical gradient between two colours you choose plus a fine grain, and places a large app screen, designed in HTML, in the middle. You stand in front of it in the lower half of the frame, scaled to about 60%.
The screen is not a still. In the example, a focus timer counts down in real time, a message types itself into a box letter by letter, and a cursor travels to the send button. Your captions carry on, with the accent word set as white text on a black label, and a faint rim light in the background colour wraps your outline.
When it works and when it hurts
It works when you are presenting an interface: your app, a landing page, a tool you built. Viewers see you and the thing you are talking about in the same frame, without cutting away from your face to a screen recording.
It hurts when the mask is weak. A busy room, strong backlight or flyaway hair all show up, because every edge of your outline sits against a clean new background. It also hurts when the screen promises something the product does not do; an invented interface is easy to build and misleading to show. And at 60% scale you give up some presence, so it may not suit the emotional peak of a video; that one is a judgement call.
How Claude builds it
The frame is built in four layers, back to front: the gradient with its grain, the app screen, you, and the captions. The app screen is written in HTML and CSS and rendered with Playwright to transparent PNGs, one for each state that changes: every second of the timer, every letter of the message, every cursor position.
Your layer is where the care goes. The mask from setup gives a soft alpha edge, but the pixels along it still carry some colour from your old room, which is the same spill problem chroma keying deals with. Claude pulls those edge colours towards the new background and keeps hair semi-transparent rather than cutting it hard. The rim light is a thin, blurred band along the inside of the mask edge, tinted with the background colour and blended over you. ffmpeg encodes the frames with your original audio.
Make it yours
Start with the gradient: two shades of your brand colour make every video in a series feel related. The screen can be anything you can describe, such as a dashboard, a sign-up page or a settings panel. If your face matters more than the screen, ask for 70% scale instead of 60%, or place yourself to one side so the screen gets the other half. Dropping the typing and cursor gives a quieter version that suits slower explanations.
Questions
Do I need a real green screen?
No. The name describes the result, not the method. The person mask from setup separates you from whatever is behind you, so any room works. A plain or green backdrop still helps, because a cleaner background gives the mask cleaner edges and leaves less colour spill to remove.
Can I use a screenshot of my real app instead of an HTML design?
Yes. Put the screenshot in the project folder and ask Claude to use it as the screen. You lose the live timer and typing unless you ask Claude to animate parts of it, but viewers see your product exactly as it is, which is often the more honest choice.
Why is there a rim light on me?
Once you are cut out and placed on a new background, your outline keeps the colour of your old room, which is a common reason composites look flat. A faint rim of the background colour along your edges ties you into the new scene. Keep it subtle; a strong rim looks like a glow.
What happens to my captions?
They keep running in the style from setup. During this effect, the accent word switches to a label with white text on a black background, so it stays readable against the bright gradient and the app screen behind you.
Step by step
Run the setup once
Open the folder that holds input.mp4 in Claude Code, choose Opus 5.5 and paste the setup prompt. The person mask it cuts is the whole basis of this effect, so footage with even light and a plain wall gives the cleanest result.
Describe your screen
Write a short description of the app screen: what it is, its main numbers and text, and where the message box sits. If it represents a real product, describe what that product actually shows.
Paste and fill in the prompt
Copy the Green Screen prompt, fill in your start and end seconds, the two gradient colours, the screen description and the message text, and send it.
Inspect the edges
Watch your hair and shoulders against the new background. If a halo of your old room shows, give Claude the second and ask it to tighten the mask there. For a quicker first look, ask for a 540×960 preview.
You need: Setup prompt (run once) · Person mask · A description of the app screen
Tips
- Light yourself evenly and record against a plain wall if you can. Every edge of your outline is exposed against the new background, so a cleaner mask makes a visible difference here.
- Pick gradient colours that sit reasonably close to the light on your face. A cool purple behind warm skin can look composited even with the rim light; compare a frame or two and judge for yourself.
- If the screen stands for a real product, show what it really does. A mock-up of features that do not exist misleads viewers.
- Keep the typed message short. It appears letter by letter, so a long line takes several seconds and pulls attention from what you are saying.
If it goes wrong
A thin outline of your old background shows around your hair or shoulders.
Ask Claude to shrink the mask edge by 1 px, pull edge colours towards the new background to remove spill, and keep the hair edge soft rather than cutting it hard.
You look pasted on.
Ask for a slightly stronger rim light, or add matching grain to your layer so it shares the texture of the background. Change one thing, then compare.
The timer or the typing runs at the wrong speed.
Ask Claude to drive both from the video time: the timer drops one second per second of video, and the typing finishes before the end of the effect range.
What it does not do
- It depends entirely on the person mask. Flyaway hair, motion blur on fast hands, or an object you hold can leave halos, or be cut away if the mask treats it as background.
- The rim light is an approximation. Your face keeps the lighting from your real room, so a strong colour mismatch with the gradient still shows.
- You are scaled to about 60%, which makes your face smaller on a phone. Expressions and lip movement read less clearly than in your full shot.
- The app screen is an HTML design with a few animated parts. It does not react to anything you do on camera.
Sources
- Chroma key — Wikipedia. Accessed October 21, 2026.
- Robust Video Matting (RVM) — GitHub — PeterL1n. Accessed October 21, 2026.
- Image segmentation guide — Google AI Edge — MediaPipe. Accessed October 21, 2026.
- Screenshots — Playwright for Python. Accessed October 21, 2026.
Want the whole library?
Lifetime opens every AI Video Effect, AI Motion Graphic and AI Creator Concept, inside Claude via MCP, for one payment of $79.