Guides
Datamosh
Smear one shot into the next, using the video's own motion.
A datamosh is what you see when a video loses its keyframe. The old picture stays on screen, and the next shot's movement pushes it around. Pixels smear and melt along the motion.
In Kinetograph it is one prop on <Video>. Nothing is baked into a clip, and every render is identical.
import { Sequence, staticFile } from 'remotion';
import { Video } from '@kinetographdev/core';
<Sequence from={30}>
<Video
src={staticFile('video/pig.mp4')}
width={1920}
height={1080}
fit="cover"
datamosh={{ from: 0, to: 45, hold: { src: staticFile('video/clouds.mp4'), frame: 90 }, mix: 0.2 }}
/>
</Sequence>The pig clip's motion drags the pixels of frame 90 of the clouds clip for 45 frames. Then the pig plays as it is.
Options
| Option | What it does |
|---|---|
from, to | The window, in frames of the Sequence. It runs from from up to, but not including, to. At most 600 frames. |
hold | The picture that gets pushed. 'previous' (default) is the clip's own frame before from. { src, frame } is a frame of another file. |
mix | 0 to 1, default 0. At 0 the old picture only melts. Higher values let the new shot's detail show through. |
Limits
- The clip must be H.264 or MPEG-4, the codecs that store motion vectors. Any other codec is drawn without the effect and warns. With
--strictthe render stops. - A
<Video>with a CSSstyleor aclassNamecan't takedatamosh. Usewidth,heightandfit. - Each frame is built from the start of the window, so a window is capped at 600 frames. Rendering in order costs about 15 ms per frame at 1080p.