packages/docs/docs/effects/tile.mdx
Part of the @remotion/effects package.
Repeats the non-transparent area of a canvas source across the canvas. Every other copy is mirrored so neighboring tiles meet at matching edges.
Place scale() before tile() to expand a texture beyond its original edges.
import {AbsoluteFill} from 'remotion';
import {Video} from '@remotion/media';
import {tile} from '@remotion/effects/tile';
import {scale} from '@remotion/effects/scale';
export const MyComp: React.FC = () => {
return (
<AbsoluteFill>
<Video
src="https://remotion.media/video.mp4"
effects={[
scale({scale: 0.25}),
tile(),
]}
/>
</AbsoluteFill>
);
};
Effects are applied in array order. tile() finds the non-transparent bounds left by scale() and alternates mirrored copies along each enabled axis.
You can call tile() without arguments or pass an object with the following properties.
horizontal?Whether to repeat the tile horizontally. Defaults to true.
vertical?Whether to repeat the tile vertically. Defaults to true.
disabled?When true, the effect is skipped. Defaults to false.