# Fade highlight layer

**URL:** <https://forum.babylonjs.com/t/fade-highlight-layer/33236>\
**Category:** Questions\
**Created:** [August 22, 2022, 4:39am UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236 "2022-08-22T04:39:32Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![qillerneu](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/qillerneu/32/18517_2.png) [@qillerneu](https://forum.babylonjs.com/u/qillerneu)\
**Post date:** [August 22, 2022, 4:39am UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236/1 "2022-08-22T04:39:32Z")

</div>

Is it possible to smoothly fade in/out highlight layer? Since addMesh only works with solid Color3, seems like manipulating color alpha wouldn’t work…

---

<div class="post-metadata">

**Author:** ![Takemura](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/takemura/32/25836_2.png) [@Takemura](https://forum.babylonjs.com/u/Takemura)\
**Post date:** [August 22, 2022, 5:33am UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236/2 "2022-08-22T05:33:47Z")

</div>

You can use `neutralColor` property: [Babylon.js docs](https://doc.babylonjs.com/typedoc/classes/babylon.highlightlayer#neutralcolor)

Corresponding example PG:

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

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [August 22, 2022, 8:39am UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236/3 "2022-08-22T08:39:47Z")

</div>

Nice trick 😍. One would need to think of it. Bookmarked, thanks for that and have a great day 🕶

---

<div class="post-metadata">

**Author:** ![qillerneu](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/qillerneu/32/18517_2.png) [@qillerneu](https://forum.babylonjs.com/u/qillerneu)\
**Post date:** [August 22, 2022, 2:17pm UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236/4 "2022-08-22T14:17:13Z")

</div>

Nice trick indeed!

Looks like it only works with inner glow?

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [August 23, 2022, 8:40am UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236/5 "2022-08-23T08:40:49Z")

</div>

I believe it works with both as per this PG

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

Edit: OOps, apologies. I believe it doesn’t. At least, not just like this. 🤔  
@Takemura any thoughts about this? Thx,

---

<div class="post-metadata">

**Author:** ![Blake](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/blake/32/21509_2.png) [@Blake](https://forum.babylonjs.com/u/Blake)\
**Post date:** [August 23, 2022, 10:24pm UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236/6 "2022-08-23T22:24:14Z")

</div>

Just for fun I made a little HighLightLayer subclass with a property to control the intensity (it works for both inner and outer glow). And then animated the intensity from 0 to 1. Here it is if you want to play around with it. 🙂

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

---

<div class="post-metadata">

**Author:** ![qillerneu](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/qillerneu/32/18517_2.png) [@qillerneu](https://forum.babylonjs.com/u/qillerneu)\
**Post date:** [August 23, 2022, 10:39pm UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236/7 "2022-08-23T22:39:46Z")

</div>

@Blake This is awesome!

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [August 24, 2022, 8:46am UTC](https://forum.babylonjs.com/t/fade-highlight-layer/33236/8 "2022-08-24T08:46:49Z")

</div>

Yes, I say ‘Yes’ 😋