3D Cube — 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.

Both shots sit on faces of a cube that turns, carrying A away and B into view.

What it does

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

Perspective rotation around a vertical (or horizontal) edge with the two shots as adjacent faces.

When: Slideshows, social carousels, playful product feature runs.

Watch out: Cinematic or emotional content; it reads as a template effect.

Timing: 0.5–1.0 s (CapCut Cube 0.47 s, Cube Rotate 1.0 s), ease-in-out

Also called: Cube, Cube Rotate, Cubic Flip, cube spin, box rotate

In FFmpeg

No cube in xfade. Use editly with gl-transitions (1.x name cube):

import editly from 'editly';
await editly({ outPath: 'out.mp4', clips: [
  { layers: [{ type: 'video', path: 'a.mp4' }], transition: { name: 'cube', duration: 0.8 } },
  { layers: [{ type: 'video', path: 'b.mp4' }] },
]});

In HyperFrames

Block transitions-3d (perspective flip/rotate); or a parent with perspective: 1200px and tween rotationY -90 → 0 on B while A goes 0 → 90 around a shared edge (transformOrigin).

In Remotion

import {glTransition} from '@gl-transitions/remotion';
<TransitionSeries.Transition presentation={glTransition({name: 'cube', params: {persp: 0.7, unzoom: 0.3}})} timing={linearTiming({durationInFrames: 24})} />

@remotion/transitions has no cube presentation; swap({}) is a related 3D swap (HTML-in-canvas).

In CapCut

Transitions tab → 3D → Cube, Cube Rotate, Cubic Flip. Desktop: drag the tile onto the cut between two clips and set Duration in the right panel ("Apply to all" reuses it on every cut). Mobile: tap the small white square between clips, pick the transition, drag the duration slider, tap ✓. Tab labels and placement change between versions and regions.

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.