# Screenshot Doesn't Include UI Elements

**URL:** <https://forum.8thwall.com/t/screenshot-doesnt-include-ui-elements/6093>\
**Category:** Technical Support\
**Tags:** studio\
**Created:** [April 16, 2025, 5:14pm UTC](https://forum.8thwall.com/t/screenshot-doesnt-include-ui-elements/6093 "2025-04-16T17:14:42Z")\
**Posts on this page:** 1\
**Showing post:** 6

<div class="post-metadata">

**Author:** ![GeorgeButler](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.8thwall.com/georgebutler/32/1903_2.png) [@GeorgeButler](https://forum.8thwall.com/u/GeorgeButler)\
**Post date:** [April 17, 2025, 5:28pm UTC](https://forum.8thwall.com/t/screenshot-doesnt-include-ui-elements/6093/6 "2025-04-17T17:28:42Z")

</div>

Updating your screenshot code to the following worked:

```ts
function takeScreenshot() {
  // Find the canvas used for rendering the 3D scene
  const {XR8} = window as any
  XR8.addCameraPipelineModule(XR8.canvasScreenshot().cameraPipelineModule())
  XR8.canvasScreenshot().takeScreenshot().then(
    (data) => {
      // myImage is an <img> HTML element
      let image = document.getElementById('myImage') as HTMLImageElement
      if (!image) {
        image = document.createElement('img')
        image.id = 'myImage'
        // image.style.display = 'none'
        image.style.position = 'absolute' // Ensure it's positioned absolutely
        image.style.zIndex = '100' // Set the z-index value
        image.style.left = '0'
        image.style.top = '0'
        image.style.width = '50%'
        image.style.height = '50%'
      }
      image.src = `data:image/jpeg;base64,${data}`
      document.body.appendChild(image)

      const link = document.createElement('a')
      link.href = `data:image/jpeg;base64,${data}`
      link.download = 'screenshot.png'
      link.click()
    },
    (error) => {
      console.log(error)
      // Handle screenshot error.
    }
  )
}

```

I changed the styling + moved the XR8 definition to be inside the screenshot function so it’s more likely it’ll be on the window by the time the function is called. 🙂

 ![Screenshot 2025-04-17 at 10.27.05 AM](https://us1.discourse-cdn.com/flex019/uploads/x8thwall/original/2X/8/8f531ad42377b36cffd031c36992539e8d1fd1e2.jpeg)

---

_[View the full topic](https://forum.8thwall.com/t/screenshot-doesnt-include-ui-elements/6093)._
