# Creating png with transparent background using CreateScreenshot

**URL:** <https://forum.babylonjs.com/t/creating-png-with-transparent-background-using-createscreenshot/46703>\
**Category:** Questions\
**Created:** [December 25, 2023, 12:41pm UTC](https://forum.babylonjs.com/t/creating-png-with-transparent-background-using-createscreenshot/46703 "2023-12-25T12:41:25Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![flex](https://avatars.discourse-cdn.com/v4/letter/f/8baadc/32.png) [@flex](https://forum.babylonjs.com/u/flex)\
**Post date:** [December 25, 2023, 12:41pm UTC](https://forum.babylonjs.com/t/creating-png-with-transparent-background-using-createscreenshot/46703/1 "2023-12-25T12:41:25Z")

</div>

Hi everyone-

I am using CreateScreenshotUsingRenderTarget to create PNGs that I then apply to buttons. I can’t figure out how to give them a transparent background. In the playground below I have 2 buttons: one uses a png loaded from an external source and the other uses one created from CreateScreenshotUsingRenderTarget. If you orbit the camera you can see that the latter button does not have a transparent background.

Any ideas?

> **[Babylon.js Playground](https://playground.babylonjs.com/#G3SKYF)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

I hope y’all are having a peaceful , joyful and love-filled holiday wherever you are and however you celebrate! One love! Sending warm greetings from Trenton, New Jersey!

-Flex

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [December 25, 2023, 1:25pm UTC](https://forum.babylonjs.com/t/creating-png-with-transparent-background-using-createscreenshot/46703/2 "2023-12-25T13:25:59Z")

</div>

In order to have transparent background on screenshots one needs to make scene clear color transparent:  
`scene.clearColor = new BABYLON.Color4 (0,0,0,0)`  
Example - [https://playground.babylonjs.com/#G3SKYF#1](https://playground.babylonjs.com/#G3SKYF#1)

---

<div class="post-metadata">

**Author:** ![flex](https://avatars.discourse-cdn.com/v4/letter/f/8baadc/32.png) [@flex](https://forum.babylonjs.com/u/flex)\
**Post date:** [December 25, 2023, 1:41pm UTC](https://forum.babylonjs.com/t/creating-png-with-transparent-background-using-createscreenshot/46703/3 "2023-12-25T13:41:34Z")

</div>

That works! Thank you.