Layers

Chroma key green screen for video

Remove a solid background colour (green screen). Put the keyed clip on an UPPER track, and the removed area shows the track below.

Shown on A rotating roll on green screen, over a studio gradient

Before · the same request without it

After · Remove the green screen so the product sits on a new background.

The entry

Add it to a clip's effects list. Entries run in the order you write them.

{
  "type": "chromaKey",
  "color": "#1DFF0A",
  "similarity": 0.34
}

Settings

Name	Accepts	Default	What it does
color	a color	required	The background colour to remove, hex like "#00FF00" for green screen.
similarity	0 to 1	0.2	How close a pixel must be to the key colour to become transparent. Raise toward 0.3 to 0.4 for uneven lighting.

Run it

The whole request behind the render above. Paste it as it is, or swap the file for your own.

TypeScript SDK cURL

import { createClient, outputUrl } from "@rendobar/sdk";

const rb = createClient({ apiKey: process.env.RENDOBAR_API_KEY });

const job = await rb.jobs.run({
  type: "compose",
  params: {
    schemaVersion: 1,
    output: {
      format: "mp4",
      resolution: {
        width: 960,
        height: 540
      }
    },
    timeline: {
      tracks: [
        {
          clips: [
            {
              asset: {
                type: "shape",
                shape: "rect",
                color: [
                  "#123A32",
                  "#05100E"
                ],
                gradient: "radial"
              },
              start: 0,
              length: 6
            }
          ]
        },
        {
          clips: [
            {
              asset: {
                type: "video",
                src: "https://cdn.rendobar.com/compose/showcase/media/green.mp4"
              },
              start: 0,
              transform: {
                scale: 0.62,
                position: {
                  x: "50%",
                  y: "52%"
                }
              },
              effects: [
                {
                  type: "chromaKey",
                  color: "#1DFF0A",
                  similarity: 0.34
                }
              ]
            }
          ]
        }
      ]
    }
  },
});

console.log(outputUrl(job));

Install with npm i @rendobar/sdk. jobs.run() submits and waits, so it returns the finished job in one call.

curl https://api.rendobar.com/jobs \
  -H "Authorization: Bearer $RENDOBAR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"type":"compose","params":{"schemaVersion":1,"output":{"format":"mp4","resolution":{"width":960,"height":540}},"timeline":{"tracks":[{"clips":[{"asset":{"type":"shape","shape":"rect","color":["#123A32","#05100E"],"gradient":"radial"},"start":0,"length":6}]},{"clips":[{"asset":{"type":"video","src":"https://cdn.rendobar.com/compose/showcase/media/green.mp4"},"start":0,"transform":{"scale":0.62,"position":{"x":"50%","y":"52%"}},"effects":[{"type":"chromaKey","color":"#1DFF0A","similarity":0.34}]}]}]}}}'

Returns immediately with a job id. Poll GET /jobs/{id} or register a webhook rather than blocking on the request.

Questions

What does the chromaKey effect do in compose?

Remove a solid background colour (green screen). Put the keyed clip on an UPPER track, and the removed area shows the track below. Remove the green screen so the product sits on a new background.

How do I add chroma key to a video with an API?

Send a compose job to the Rendobar API with this entry in the timeline: {"type":"chromaKey","color":"#1DFF0A","similarity":0.34}. Add it to a clip's effects list. Entries run in the order you write them. The request on this page is complete and renders as shown.

What are the default settings for chroma key?

Set color. The rest have defaults: similarity 0.2.

Footage and sound

HD video of a Chicken fillet roll - rotating green screen alan butler.webm, by Alan Butler. CC0.

Mask The footage seen through the wordmark: a logo reveal, with the logo's own transparency as the matte. Region blur Hide one part of the picture and leave the rest sharp: here what is on a laptop screen. Outline The sticker look: a keyed product with a thick white edge and a shadow under it. Drop shadow Keep a white logo readable over bright water. Color A warm cinematic grade: the light pulled towards gold, contrast and color lifted a little, skin left believable. LUT A film grade from a LUT file: shadows toward teal, skin and highlights toward orange, the look a colourist hands over as a .cube.

See all 77 in the effects reference →