# Transparent objects and edge do not render correctly

**URL:** <https://forum.babylonjs.com/t/transparent-objects-and-edge-do-not-render-correctly/42631>\
**Category:** Questions\
**Tags:** material\
**Created:** [July 22, 2023, 7:58am UTC](https://forum.babylonjs.com/t/transparent-objects-and-edge-do-not-render-correctly/42631 "2023-07-22T07:58:31Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![heyefeng229](https://avatars.discourse-cdn.com/v4/letter/h/f04885/32.png) [@heyefeng229](https://forum.babylonjs.com/u/heyefeng229)\
**Post date:** [July 22, 2023, 7:58am UTC](https://forum.babylonjs.com/t/transparent-objects-and-edge-do-not-render-correctly/42631/1 "2023-07-22T07:58:32Z")

</div>

Hello, I have a problem.When an object rendering with Edge and the other tranparent object is in front of it,the edge of the object rend not affected by transparency. \*The edge color is not mixed with the translucent color of the front.

> **[Babylon.js Playground](https://playground.babylonjs.com/#TYAHX%23278)**
>
> 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:** [July 22, 2023, 8:42am UTC](https://forum.babylonjs.com/t/transparent-objects-and-edge-do-not-render-correctly/42631/2 "2023-07-22T08:42:55Z")

</div>

I think it’s because the edge rendering is done at a later stage and does not account for the alpha test or blend. Let’s ask the expert, see if there’s a work-around for this? cc @Evgeni_Popov

---

<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:** [July 22, 2023, 9:19am UTC](https://forum.babylonjs.com/t/transparent-objects-and-edge-do-not-render-correctly/42631/3 "2023-07-22T09:19:00Z")

</div>

As @mawa said, edge rendering is the very last step of the rendering process, even after the transparent meshes.

If you want some meshes to appear in front of transparent meshes, you will either have to:

- enable depth writing (`mat.forceDepthWrite = true`) for the transparent objects, but you won’t be able to see the edges behind the transparent objects =\> [https://playground.babylonjs.com/#TYAHX#280](https://playground.babylonjs.com/#TYAHX#280)
- render your transparent objects with a higher `renderingGroupId`, so that they are rendered after the edges =\> [https://playground.babylonjs.com/#TYAHX#279](https://playground.babylonjs.com/#TYAHX#279)

---

<div class="post-metadata">

**Author:** ![heyefeng229](https://avatars.discourse-cdn.com/v4/letter/h/f04885/32.png) [@heyefeng229](https://forum.babylonjs.com/u/heyefeng229)\
**Post date:** [July 24, 2023, 1:13am UTC](https://forum.babylonjs.com/t/transparent-objects-and-edge-do-not-render-correctly/42631/4 "2023-07-24T01:13:45Z")

</div>

Thank you very much ! The solution is very useful.
