# Fading between two scenes

**URL:** <https://forum.babylonjs.com/t/fading-between-two-scenes/38277>\
**Category:** Questions\
**Tags:** postprocessing, scene-switch, scenes\
**Created:** [February 16, 2023, 4:24pm UTC](https://forum.babylonjs.com/t/fading-between-two-scenes/38277 "2023-02-16T16:24:18Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![tancaj](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tancaj/32/30030_2.png) [@tancaj](https://forum.babylonjs.com/u/tancaj)\
**Post date:** [February 16, 2023, 4:24pm UTC](https://forum.babylonjs.com/t/fading-between-two-scenes/38277/1 "2023-02-16T16:24:19Z")

</div>

Hi,

I have two scenes and I’d like to switch between them with a slider with a fading effect. So as the first scene fades the other one starts to appear.

I’ve tried to solve this with post-processes. I created two custom postprocess with the same shader code for the two scenes. I thought I could fade the scenes independently with the two seemingly independent post processes, but with two post processes present the first scene did not appear at all. The post process itself, with one scene, worked as I expected.

[Playground](https://playground.babylonjs.com/#29P7AB#2)

In desperation, I tweaked some settings that seemed somewhat relevant (commented lines in pg), but all I could get is an error, that went over my head:

![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/1/0/10ea3e80c990cce1a87e571a74ee887397e4b8a7.png)

Is it possible to use postprocesses this way?

THanks!

---

<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:** [February 16, 2023, 7:27pm UTC](https://forum.babylonjs.com/t/fading-between-two-scenes/38277/2 "2023-02-16T19:27:27Z")

</div>

Welcome aboard!

What you need to do is to generate the first scene in a texture, then mix that texture with the 2nd scene.

To do that:

- you can create a “pass” post-process for the first scene and use `effect.setTextureFromPostProcess` to bind this texture to the shader that will mix the textures
- update your “Fade” shader to mix the two textures

Here’s an updated PG:

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

---

<div class="post-metadata">

**Author:** ![tancaj](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tancaj/32/30030_2.png) [@tancaj](https://forum.babylonjs.com/u/tancaj)\
**Post date:** [February 17, 2023, 10:20am UTC](https://forum.babylonjs.com/t/fading-between-two-scenes/38277/3 "2023-02-17T10:20:08Z")

</div>

Thank you very much!