# How can I solve this transparent clipping problem? Using only depthTest will cause rendering errors! Thanks!

**URL:** <https://discourse.threejs.org/t/how-can-i-solve-this-transparent-clipping-problem-using-only-depthtest-will-cause-rendering-errors-thanks/75634>\
**Category:** Questions\
**Tags:** transparency\
**Created:** [December 25, 2024, 6:44am UTC](https://discourse.threejs.org/t/how-can-i-solve-this-transparent-clipping-problem-using-only-depthtest-will-cause-rendering-errors-thanks/75634 "2024-12-25T06:44:48Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![wpz614467735](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/wpz614467735/32/55023_2.png) [@wpz614467735](https://discourse.threejs.org/u/wpz614467735)\
**Post date:** [December 25, 2024, 6:44am UTC](https://discourse.threejs.org/t/how-can-i-solve-this-transparent-clipping-problem-using-only-depthtest-will-cause-rendering-errors-thanks/75634/1 "2024-12-25T06:44:48Z")

</div>

![transparent](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/7/e/7e8a375b9df4ffce7f320a886377bbbe0b97452e.gif)

---

<div class="post-metadata">

**Author:** ![manthrax](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/manthrax/32/2596_2.png) [@manthrax](https://discourse.threejs.org/u/manthrax)\
**Post date:** [December 25, 2024, 11:01pm UTC](https://discourse.threejs.org/t/how-can-i-solve-this-transparent-clipping-problem-using-only-depthtest-will-cause-rendering-errors-thanks/75634/2 "2024-12-25T23:01:15Z")

</div>

There are a few tools for dealing with this…

But they are all kinda hacks since transparency itself is a hack.

So in no particular order:  
setting depthTest:false – disables depth test… making the mesh always render

or depthWrite: false – mesh renders but doesn’t write its own depth to the depth buffer, so a later mesh will overwrite it…

setting .renderOrder on the meshes to control which one renders first…  
blueMesh.renderOrder = 1  
redMesh.renderOrder = 2

there is also:  
using side:THREE.BackSide - only render back faces…

and/or then on a clone of the mesh using side THREE.FrontSide - only render front faces…

and finally…

breaking the meshes into smaller chunks that can then be depthSorted correctly by the default transparency depth sort which sorts by center point iirc.

and lastly, if you’re Really looking for a struggle…  
the “depth peeling” rabbit hole:

> [@Depth peel and transparency](https://discourse.threejs.org/t/depth-peel-and-transparency/5365/13):
>
> A common transparency problem is liquid inside glass like in this [model](http://cdn.hexa3d.io/hotlink-ok/test/Scotch-glb_002.glb). Does depth peeling help with this case? Great work on this so far btw👏