# Transparency in custom shader?

**URL:** <https://forum.babylonjs.com/t/transparency-in-custom-shader/45521>\
**Category:** Questions\
**Created:** [November 7, 2023, 1:43pm UTC](https://forum.babylonjs.com/t/transparency-in-custom-shader/45521 "2023-11-07T13:43:18Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Escobar](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/escobar/32/2726_2.png) [@Escobar](https://forum.babylonjs.com/u/Escobar)\
**Post date:** [November 7, 2023, 1:43pm UTC](https://forum.babylonjs.com/t/transparency-in-custom-shader/45521/1 "2023-11-07T13:43:18Z")

</div>

Probably my approach is really naive

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

But the idea was that the red sphere should be seen through the holes.

I managed to make it work by using  
shaderMaterial.alpha = 0.9999;

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

But I’m not sure why I need to setup it.

(btw my final intention is to see the “real world” using immersive-ar)

Thank you!

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [November 7, 2023, 2:47pm UTC](https://forum.babylonjs.com/t/transparency-in-custom-shader/45521/2 "2023-11-07T14:47:52Z")

</div>

You need to indicate to the `ShaderMaterial` constructor that alpha blending should be enabled by setting `needAlphaBlending: true` when you create the material:

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

---

<div class="post-metadata">

**Author:** ![Escobar](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/escobar/32/2726_2.png) [@Escobar](https://forum.babylonjs.com/u/Escobar)\
**Post date:** [November 7, 2023, 5:52pm UTC](https://forum.babylonjs.com/t/transparency-in-custom-shader/45521/3 "2023-11-07T17:52:55Z")

</div>

Just for future readers here is the modified version that uses the camera as background:

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