# How to achieve 3D BOX gradient transparency and glow

**URL:** <https://forum.babylonjs.com/t/how-to-achieve-3d-box-gradient-transparency-and-glow/427>\
**Category:** Questions\
**Created:** [December 25, 2018, 9:48am UTC](https://forum.babylonjs.com/t/how-to-achieve-3d-box-gradient-transparency-and-glow/427 "2018-12-25T09:48:09Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![dataangel](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/dataangel/32/82_2.png) [@dataangel](https://forum.babylonjs.com/u/dataangel)\
**Post date:** [December 25, 2018, 9:48am UTC](https://forum.babylonjs.com/t/how-to-achieve-3d-box-gradient-transparency-and-glow/427/1 "2018-12-25T09:48:09Z")

</div>

![%E6%9C%AA%E6%A0%87%E9%A2%98%201](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/1X/d65ba8d8a7cf1e77da8bda0e879756507b19e120.jpeg)

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [December 26, 2018, 11:02am UTC](https://forum.babylonjs.com/t/how-to-achieve-3d-box-gradient-transparency-and-glow/427/2 "2018-12-26T11:02:36Z")

</div>

There is no such functionality in Babylon currently. Glow and highlights are limiited to none transparent meshes as they required depth information to be drawn.

---

<div class="post-metadata">

**Author:** ![dataangel](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/dataangel/32/82_2.png) [@dataangel](https://forum.babylonjs.com/u/dataangel)\
**Post date:** [December 28, 2018, 1:39am UTC](https://forum.babylonjs.com/t/how-to-achieve-3d-box-gradient-transparency-and-glow/427/3 "2018-12-28T01:39:32Z")

</div>

Is there any other way?

---

<div class="post-metadata">

**Author:** ![nasimiasl](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/nasimiasl/32/34_2.png) [@nasimiasl](https://forum.babylonjs.com/u/nasimiasl)\
**Post date:** [December 28, 2018, 8:32am UTC](https://forum.babylonjs.com/t/how-to-achieve-3d-box-gradient-transparency-and-glow/427/4 "2018-12-28T08:32:44Z")

</div>

@dataangel  
hi  
[https://www.babylonjs-playground.com/#1TYWYB#198](https://www.babylonjs-playground.com/#1TYWYB#198)

[https://www.babylonjs-playground.com/#1TYWYB#199](https://www.babylonjs-playground.com/#1TYWYB#199)

[https://www.babylonjs-playground.com/#1TYWYB#200](https://www.babylonjs-playground.com/#1TYWYB#200)

[https://www.babylonjs-playground.com/#1TYWYB#201](https://www.babylonjs-playground.com/#1TYWYB#201)

[https://www.babylonjs-playground.com/#1TYWYB#202](https://www.babylonjs-playground.com/#1TYWYB#202)

use that last one and change setting

var setting\_glow = {  
level:5,  
step:10,  
radius:0.005,  
power:0.8,  
borderColor:‘1.,1.,1.’ ,  
innerPower:0.,  
innerColor:‘1.,1.,1.’ };

---

<div class="post-metadata">

**Author:** ![dataangel](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/dataangel/32/82_2.png) [@dataangel](https://forum.babylonjs.com/u/dataangel)\
**Post date:** [December 28, 2018, 5:24pm UTC](https://forum.babylonjs.com/t/how-to-achieve-3d-box-gradient-transparency-and-glow/427/5 "2018-12-28T17:24:38Z")

</div>

Thank you very much.