Remotion adds support for HTML-in-canvas effects
Remotion's new HtmlInCanvas component lets you apply canvas effects to HTML text, buttons, and layouts, including distortion and shaders. Its onPaint callback gives you control over the rendered content.
Previewing in Studio requires Google Chrome v149 or later with chrome://flags/#canvas-draw-element enabled. From v4.0.455, rendering works out of the box locally, on Lambda, on Vercel, and through server-side rendering APIs.
WebGL shaders need --gl=angle when rendering, or --gl=swangle on machines without a GPU. HtmlInCanvas components can't be nested; combine effects in a single onPaint callback.
The underlying Chromium API is experimental and unstable. Chrome may change or remove it.
Loading replies…
Loading replies