One state. Two surfaces.

One application state owns caption, accent and effect. Both a semantic HTML card and an independently drawn Canvas2D cover consume the same snapshot. Pixelated mode paints that cover into a smaller detached canvas, then enlarges it with image smoothing disabled. Inputs and resize events redraw the current state without replacing native controls. This is manual drawing of known content, not automatic HTML rasterization.

Independent implementation informed by “Exploring the HTML-in-Canvas Proposal”, Vittorio Retrivi, Codrops. This is newly authored code and artwork, not a recovered original project. The acquired original failed in the recorded environment because requestPaint was not callable; its success was not verified. This example does not implement the HTML-in-Canvas proposal, copy arbitrary HTML/CSS, transform DOM hit testing, or reproduce the original Fluid/Rain shaders. The duplicate canvas is hidden from the accessibility tree; visible semantic content and native controls remain outside it. No assistive-technology conformance is claimed. Caption input is bounded to 28 code units by the native field. Empty captions keep the artwork visible. Long captions shrink to fit the painted line and wrap in the semantic card. Both presentation modes are stationary. A Canvas2D failure keeps the DOM representation usable and emits an error instead of readiness.