Skip to main content
TUTORIAL

Chroma Key Tutorial — Green Screen, Spill Suppression, and Edge Refinement

Skrrol AI Editorial8 min read

In this article

  1. 1.Shoot for the key: lighting, distance, fabric vs paint
  2. 2.Import the clip and pull the initial key
  3. 3.Refine the matte: choke, soften, despill
  4. 4.Killing green spill
  5. 5.Edge treatment: hair, motion blur, sub-pixel detail
  6. 6.Composite onto a new background
  7. 7.Common mistakes that ruin a key
  8. 8.When AI smart-cutout beats green screen
  9. 9.Advanced: light wrap, holdout mattes, and clean plates
  10. 10.Performance: keying in the browser at 1080p and 4K

Chroma keying — pulling a subject out of a colored background and dropping them onto something else — is one of the oldest tricks in post production and it still trips people up because most of the work happens before the camera rolls. A clean key is mostly a lighting problem; if the screen is lit evenly and the subject is far enough away from it, the keying itself takes about thirty seconds. If the screen is hot in the middle and dark in the corners and the subject is two feet away from it, no amount of post can save the result. This tutorial walks through the full pipeline, with the on-set decisions that matter most up front.

Shoot for the key: lighting, distance, fabric vs paint

Three on-set rules, in order of importance. First: the green screen must be evenly lit. Use two soft sources of equal brightness, one from each side, aimed only at the screen. The brightness across the screen surface should not vary by more than half a stop. Hot spots are the number one cause of un-keyable footage. Second: the subject stands at least two meters from the screen. The closer they are, the more green light spills onto them, and spill is much harder to fix than the key itself. Third: light the subject with a separate set of lights that have no green in them. Tungsten or daylight LEDs are fine; avoid anything with a green tint to the spectrum.

Import the clip and pull the initial key

Drag the green screen clip into the timeline and put it on a track above your background plate. Open the chroma key effect and use the eyedropper to sample the green — click somewhere in the middle of the screen, in the cleanest area, away from any soft shadow or hot spot. The editor builds an initial matte: pixels in the sampled hue range become transparent (revealing the background plate), pixels outside that range stay opaque (the subject).

Switch the preview to matte view. You will see the subject as a white silhouette on a black background. This is the diagnostic view you stay in for the next several steps. Anything that should be solid white but is gray (subject) means the foreground is partially transparent — a problem. Anything that should be solid black but is gray (the green area) means the background is not fully keyed — also a problem. Both are fixable but you must see the matte to fix them.

Refine the matte: choke, soften, despill

Three controls handle the bulk of refinement. Tolerance widens or narrows the hue range that gets keyed — wider tolerance kills more green but eats into the subject's edges if you go too far. Choke shrinks the matte inward, removing thin transparent edges around the subject. Soften feathers the matte boundary so it does not look like a hard cookie-cutter line. Adjust them in this order: tolerance until the screen is fully transparent, choke until the edges are clean, soften by a small amount (1–2 pixels) for natural blending.

Killing green spill

Spill is the green tint that bounces off the screen onto the subject, especially on hair, light-colored clothing, and skin. Even with a perfectly keyed matte, spill makes the composite look fake — your subject literally has a green halo from the lighting they were under. The despill control desaturates green only on the foreground; it leaves greens that are part of the subject (a green hat) untouched if you set the tolerance right, but it neutralizes the unintentional green cast on skin and hair.

After despill, look at the subject's hair against a dark background plate. If the hair edges still look green-tinged, increase despill strength. If skin starts looking magenta (despill went too far the other way), back off. The right setting leaves hair and skin reading neutral against any background you composite onto.

Edge treatment: hair, motion blur, sub-pixel detail

Hair is where amateur keys and professional keys diverge. A hard matte cuts off hair strands and the subject ends up looking like a paper cutout. Soft edges and fine-detail recovery let those strands stay translucent against the new background, which is how it works in real life. Skrrol exposes a 'detail recovery' control that re-introduces semi-transparent edge pixels back into the matte at the cost of a tiny bit of green spill, which despill then handles. For motion blur — fast-moving hands, hair flips — the same recovery logic preserves the motion blur edge instead of carving it off.

Composite onto a new background

With the matte clean, switch the preview off matte view and back to color. Drop your background plate on the track below the keyed clip. The subject now sits on the new background. Two things to fix immediately: color match the foreground to the background lighting (if the background is a sunset, your tungsten-lit subject looks wrong; warm them up to match), and add a slight blur to the background if it should look out-of-focus relative to the subject. Both of these are color and effects work, not keying work, but they are what makes the composite read as one shot instead of two stacked clips.

If the subject has a strong rim light from the original shoot, that light will look wrong against a different background unless its direction matches. The professional fix is to add a synthetic rim light in the editor — a thin highlight along the subject's edge, in the direction the new background's key light implies. It is a five-second effect and it sells the composite.

Common mistakes that ruin a key

When AI smart-cutout beats green screen

Sometimes the right answer is to skip the green screen entirely. AI segmentation models — Skrrol's smart-cutout uses a fine-tuned variant of SAM running fully in the browser via WebGPU — can isolate a subject from any background, no chroma needed. The trade-off is honest: smart-cutout is slightly less precise on fine hair and motion blur than a well-shot key, and it costs more compute per frame. But for talking-head footage shot against an arbitrary background, for vlogs filmed in a coffee shop, or for archival footage where reshooting on green is impossible, smart-cutout is often the better tool. It is also the only option for AI-generated footage, which is rarely born on a controlled green screen.

Workflow-wise, smart-cutout slots into the same place chroma key would: drop the source clip on a track above the new background, apply the cutout effect, refine edges, despill (yes, even smart-cutout output benefits from a despill pass since the original lighting can leak color onto the subject). The keying step is cheaper, the matte refinement step is the same, and the composite step is identical. Pick the tool to fit the shoot — chroma when you have control of the set, AI cutout when you do not.

Advanced: light wrap, holdout mattes, and clean plates

Three techniques separate broadcast-clean keys from amateur keys. Light wrap is a thin halo of background color sampled from behind the subject and laid over the subject's edges. It mimics how real light bounces off a background and onto a foreground subject — the absence of light wrap is part of why composites look pasted-on. The recipe: blur the background plate by 8–12 pixels, mask it to a 2–4 pixel band along the subject's matte edge, and composite that band over the foreground at 30–50% opacity. Skrrol exposes this as a single 'light wrap' control with intensity and width sliders.

Holdout mattes solve the problem of partial transparency where you do not want it. A subject's pupils, the inside of their open mouth, dark glass on a watch — pixels that share color with the green screen but are part of the subject can punch holes in the matte. Draw a hand-rolled mask over those regions and force the keyer to treat them as solid foreground regardless of their color. It is five seconds of work per shot and it kills the most common 'why is there a hole in their pupil' artifact dead.

Clean plates are the unsung hero of professional keying. Before the subject walks on set, shoot 5–10 seconds of the empty green screen with the same lighting and camera settings. That empty plate becomes a difference-key reference: any pixel in the live shot that differs significantly from the corresponding pixel in the clean plate is foreground. Clean plates handle uneven lighting and screen wrinkles better than any color-based key, because they encode exactly what the screen looked like that day in those conditions. They are extra work on set; they are also the difference between a fixable shot and an unfixable one.

Performance: keying in the browser at 1080p and 4K

Real-time chroma keying in a web browser was a pipe dream three years ago and is routine today. Skrrol's keyer is implemented as a WebGPU compute shader: each pixel is processed in parallel on the GPU using the same algorithms (despill, edge erosion, soft matte) that desktop NLEs use. At 1080p the keyer runs at 30+ frames per second on integrated graphics and 60+ frames per second on any laptop with a discrete GPU. At 4K the picture is more nuanced — discrete GPUs handle it real-time, integrated GPUs fall back to a half-resolution preview during scrubbing and switch to full resolution on render.

Two practical performance tips. First, if you are seeing dropped frames during scrubbing on a long key, pre-render the keyed segment to OPFS — Skrrol caches the rendered output and plays it back without re-keying every frame. Second, the matte view itself costs roughly the same as the composite view, so toggle off matte view when you are not actively refining. The biggest cost of complex VFX in the browser is showing too many heavy effects in the preview at once; keep the preview focused on the work in front of you.

Related editor features

Skrrol capabilities that pair with this article.

Related generators

AI generation tools that fit this workflow.

Related use cases

Workflows where this article matters most.

Frequently asked questions

What is the best green screen color?

Chroma key green — Pantone 354, roughly RGB (0, 177, 64). It is far from human skin tones in color space, which makes the key cleaner. Blue screens are an alternative when the subject must wear green; they are slightly noisier in low light.

How far should the subject stand from the green screen?

At least two meters. Closer than that and green light bouncing off the screen onto the subject creates spill that is hard to remove cleanly in post.

My screen is unevenly lit. Can I save the shot in post?

Sometimes. Use a garbage matte to mask out the problem areas of the screen, and let the chroma key handle only the well-lit section. If the unevenness is severe across the entire screen, you may need to reshoot — no keyer can rescue truly bad source footage.

What is spill and how do I get rid of it?

Spill is the green tint that bounces from the screen onto your subject. The despill control desaturates green on the foreground without affecting the matte. Apply it after pulling the key, watch hair and skin edges, and back off if skin starts looking magenta.

When should I use AI cutout instead of green screen?

When you cannot control the set — vlogs in real locations, archival footage, AI-generated clips. AI smart-cutout works on any background but is slightly less precise on fine hair and fast motion than a properly-shot green screen key.

Can I do chroma keying in the browser?

Yes. Skrrol's chroma key effect runs as a WebGPU compute shader, so 1080p keying is real-time on most modern laptops. 4K keying is real-time on machines with discrete GPUs and falls back to slower preview on integrated GPUs.

Keep reading

Ready to put this into practice?

Open the Skrrol editor — no install, no upload, your files stay on your device.