GL Transitions via editly or FFmpeg — effect skill for transitions

For AI agents: find the right skill in one call — curl -s "https://varg.ai/how-to/api/search?q=<what the person wants>" returns the matching how-to page and the best skills with install commands, as markdown (Russian works too). Full index: https://varg.ai/how-to/llms.txt. Every page has a markdown twin: add .md to its path. Before generating anything, show the person the options on the how-to page.

Run any of the ~125 GLSL gl-transitions between clips: editly (no custom build) or a patched FFmpeg.

What it does

Built on Cube by gre (gl-transitions), MIT. The write-up and recipes below are varg's.

Cube, page curl, doorway, morph, burn, glitch and other shader transitions xfade cannot do.

When: Server-side batch renders that need 3D or organic transitions without a browser.

Watch out: Mixing name sets: editly depends on gl-transitions 1.x (crosswarp, cube), the 2.0 catalog uses PascalCase (CrossWarp, Cube).

Timing: 0.5–1.0 s typical

Also called: gltransition filter, ffmpeg-gl-transition, editly, ffmpeg-concat, GLSL transitions

In FFmpeg

FFmpeg itself has no GL transitions. Option 1, editly (Node, standard ffmpeg):

import editly from 'editly';
await editly({
  outPath: 'out.mp4',
  defaults: { transition: { name: 'crosswarp', duration: 0.5 } },
  clips: [
    { layers: [{ type: 'video', path: 'a.mp4' }] },
    { transition: { name: 'cube', duration: 1, params: { persp: 0.5 } }, layers: [{ type: 'video', path: 'b.mp4' }] },
    { layers: [{ type: 'video', path: 'c.mp4' }] },
  ],
});

transition on a clip applies between it and the next; also random, dummy, directional-left|right|up|down. Option 2, the third-party gltransition filter (rebuild FFmpeg with the patch, needs an OpenGL/EGL context):

ffmpeg -i a.mp4 -i b.mp4 -filter_complex "gltransition=duration=1:offset=2:source=CrossWarp.glsl" out.mp4

The filter sets only progress and ratio; bake parameter uniforms into constants, and transitions that need extra textures do not work.

Ready-made components

Where this comes from

Use when

Not for

Install

Example output

https://s3.varg.ai/how-to/previews/c62b6d8fdbea/lib-gl-transitions-cube.mp4 — Preview of the Cube component that builds this take (credit: Rendered by varg from the library’s own code (GL Transitions · rendered by varg), https://gl-transitions.com/editor/Cube)

More transitions skills

Run the generation on varg

varg is one API key for the models these skills drive — Seedance 2.5, Kling 4, Veo 3.1, Wan 3, Nano Banana 2.1, GPT Image 2.5, ElevenLabs v4 and 200+ more — billed in credits, with a cost estimate before anything runs.