Chrome Launches Origin Trial for HTML-in-Canvas API
In May 2026, Google launched an origin trial for the experimental "HTML-in-Canvas API," which can render real HTML/DOM inside a <canvas> element. Available in Chrome 148–150, it is drawing attention as a "bridge" that combines Canvas's low-level graphics with the interactivity and accessibility of the DOM.
What Happened
Around May 19, 2026, the Chrome for Developers official blog announced the start of the origin trial for the HTML-in-Canvas API. It targets Chrome 148–150, with Canary 149 or later recommended.
This API places actual HTML/DOM content inside a <canvas> element and synchronizes it with Canvas drawing (2D/WebGL/WebGPU), enabling the use of low-level graphics while preserving interactivity, accessibility, and browser integration features. The implementation can be enabled via the Chromium flag chrome://flags/#canvas-draw-element, and it has been confirmed working in Chrome Canary, Brave Stable, and others.
The specification is published and being updated as an explainer on the WICG (Web Incubator Community Group) GitHub, and it is also registered on Chromestatus. Key primitives provided include the layoutsubtree attribute that makes child elements subject to layout and hit testing, drawElementImage() (2D) / texElementImage2D() (WebGL) / copyElementImageToTexture() (WebGPU), and a paint event that fires when child elements change.
It was also introduced at Google I/O 2026 by Thomas Nattestad and others, and libraries such as Three.js and PlayCanvas have added experimental support.
Background and Significance
Traditionally, complex visual applications such as games, 3D scenes, and Figma/Miro/Google Docs-style tools faced a trade-off between "DOM semantics and accessibility" and "Canvas's low-level performance." Because Canvas is a pixel grid, features such as text selection, copy/paste, right-click, screen readers, find-in-page, extensions, and translation tended to break.
The HTML-in-Canvas API is positioned as a "bridge" that resolves this barrier, drawing DOM content directly onto Canvas while automatically maintaining hit testing and browser features. Unlike screenshot-style libraries such as html2canvas, the biggest difference is that it can handle live, interactive, real DOM elements. With high affinity for WebGPU/WebGL, it is seen as a move linked to the GPU-native evolution of browsers. mattrothenberg
However, there are limitations. It applies only to direct child elements that require a generated box, display:none is not allowed, and using WebGL/WebGPU requires position calculation via shaders. Currently, production use requires trial registration, and browsers other than Chromium are not supported (still at the proposal stage). No published figures such as benchmarks have been confirmed at this point, but there is mention that it is "planned for stabilization in the near future."
Reactions
On X, demo posts became active starting around April 2026, with favorable voices standing out. Comments such as "It breaks down the DOM vs Canvas barrier," "SEO/AI support is dramatically improved," and "Accessibility comes by default" followed one after another. kvncnls
Specific use cases cited include 3D books that have real DOM text on the page and respond instantly to translation, interactive UI such as sliders and forms on WebGL/WebGPU, route transition animations, and combinations with shaders. dogbot3k
Meanwhile, there were also points raised about stumbling blocks and limitations, such as the requirement of a flag making it unusable in production, the hassle of position synchronization via transform calculations, and the need for MVP matrix transformations with WebGL/WebGPU. Still, negative voices regarding performance or stability were few, and the overall mood was dominated by expectations such as "It's experimental but makes you want to try it" and "An API that makes the web fun." Discussion has also arisen on Hacker News. HN