HTML-in-canvasv4.0.447

On supported Chromium-based browsers, @remotion/web-renderer can optionally capture full frames using the experimental HTML-in-canvas APIs.

Enabling the option does not guarantee that this path runs. If the browser does not have HTML-in-canvas enabled, it falls back to the default frame capturing mechanism.

Enabling

In code

Pass allowHtmlInCanvas: true to renderMediaOnWeb() or renderStillOnWeb(). The default is false when you omit the field.

Example
await renderStillOnWeb({
  composition,
  frame: 0,
  inputProps: {},
  allowHtmlInCanvas: true,
});

In the Studio

With client-side rendering enabled, open the render modal, go to the Other tab, and turn on Allow HTML-in-canvas. The initial value comes from your config and CLI defaults (below).

As the Studio default

In remotion.config.ts:

remotion.config.ts
Config.setAllowHtmlInCanvasEnabled(true);

Or start Studio with the CLI flag (it overrides the config file for this value):

npx remotion studio --allow-html-in-canvas

See setAllowHtmlInCanvasEnabled() and npx remotion studio for details. The flag description is also available as:

When client-side rendering is enabled in the Studio, allow the experimental Chromium HTML-in-canvas API to be used for capturing frames. See HTML-in-canvas docs.

Check if HTML-in-canvas was used

If HTML-in-canvas was used, you will see a warning in the browser console:

Using Chromium experimental HTML-in-canvas (drawElementImage) for this frame. Pixels may differ from the built-in DOM composer. Set allowHtmlInCanvas: false to force software rasterization. See https://github.com/WICG/html-in-canvas

If HTML-in-canvas is available, and allowed, but not used, a warning will be printed:

Not using HTML-in-canvas: drawElementImage is available but canvas.requestPaint() is missing. Use a Chromium version that ships requestPaint.

This can happen for example if enabling the feature in Chrome rather than Chrome Canary (as of time of writing in April 2026).

If HTML-in-canvas is not available, or not allowed, no warning will be printed.

Compatibility

Browsers			Environments
Chrome	Firefox	Safari	Client-side rendering	Server-side rendering	Player	Studio

HTML-in-canvas depends on Chromium flag chrome://flags/#canvas-draw-element which needs to be explicitly enabled as of time of writing in April 2026.

Enabling​

In code​

In the Studio​

As the Studio default​

Check if HTML-in-canvas was used​

Compatibility​

See also​