<mr-app data-preserve-drawing-buffer="true"> ... </mr-app>

Preserve-drawing-buffer state can be attached to an mr-app using data-preserve-drawing-buffer:


This enables the common html use-case of ‘right-click to save’ a png file of what’s on the screen.

Note: Most chromium-based browsers (chrome, duckduckgo, arc, etc…) have this feature by default making the use of this flag unnecessary

Allowing this as a feature the user toggles manually, because it causes a performance hit and isnt a strong requirement by default for most people who are interacting.

Change color! mr-panel { display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; width: 100vw; height: 100vh; } mr-button { font-family: system-ui; background-color: white; padding: 8px 16px; font-size: 150%; border-radius: 20px; } function changeColor() { let hue = Math.floor(Math.random() * 360); let color = 'hsl(' + hue + ', 100%, 80%)'; document.querySelector("#panel").style.backgroundColor = color; } changeColor();