# BUG: TransformControls + material + transparent:true = 😞

**URL:** <https://discourse.threejs.org/t/bug-transformcontrols-material-transparent-true/7366>\
**Category:** Questions\
**Tags:** transform-controls, transparency, materials\
**Created:** [May 4, 2019, 2:46pm UTC](https://discourse.threejs.org/t/bug-transformcontrols-material-transparent-true/7366 "2019-05-04T14:46:05Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![POP](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pop/32/31182_2.png) [@POP](https://discourse.threejs.org/u/POP)\
**Post date:** [May 4, 2019, 2:46pm UTC](https://discourse.threejs.org/t/bug-transformcontrols-material-transparent-true/7366/1 "2019-05-04T14:46:05Z")

</div>

Bug found.

If you attach the THREE.TransformControls to an object that has its material set to **transparent:true** , the TransformControls will incorrectly be placed **BEHIND** the object.

**OK:** var material = new THREE.MeshBasicMaterial( { map: texture, **transparent:false** } );

![41%20PM](https://cdck-file-uploads-canada1.s3.dualstack.ca-central-1.amazonaws.com/flex035/uploads/threejs/original/2X/2/279a3e9ff6c09c3b7a51d0785e30c17f68a3b224.jpeg)

**BUG:** var material = new THREE.MeshBasicMaterial( { map: texture, **transparent:true** } );

![00%20PM](https://cdck-file-uploads-canada1.s3.dualstack.ca-central-1.amazonaws.com/flex035/uploads/threejs/original/2X/c/c58771df82ca61bfc6e34cec33ee6aee64d0603d.jpeg)

---

<div class="post-metadata">

**Author:** ![looeee](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/looeee/32/59_2.png) [@looeee](https://discourse.threejs.org/u/looeee)\
**Post date:** [May 4, 2019, 3:19pm UTC](https://discourse.threejs.org/t/bug-transformcontrols-material-transparent-true/7366/2 "2019-05-04T15:19:19Z")

</div>

This is because transparent objects are rendered last. You could make the gizmo’s material transparent too to overcome this.

---

<div class="post-metadata">

**Author:** ![POP](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pop/32/31182_2.png) [@POP](https://discourse.threejs.org/u/POP)\
**Post date:** [May 4, 2019, 3:47pm UTC](https://discourse.threejs.org/t/bug-transformcontrols-material-transparent-true/7366/3 "2019-05-04T15:47:19Z")

</div>

Thank you looeee

The solution I found is to set **object.renderOrder = - 1;**