# Transparent background

**URL:** https://discourse.threejs.org/t/transparent-background/22742
**Category:** Questions
**Tags:** textures, animation
**Created:** [January 23, 2021, 6:28am UTC](https://discourse.threejs.org/t/transparent-background/22742 "2021-01-23T06:28:29Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![jackowacko](https://avatars.discourse-cdn.com/v4/letter/j/48db29/32.png) [@jackowacko](https://discourse.threejs.org/u/jackowacko)
#### Post date: [January 23, 2021, 6:28am UTC](https://discourse.threejs.org/t/transparent-background/22742/1 "2021-01-23T06:28:29Z")

</div>

Hi. this is my first time working with threejs and it’s awesome so far! I found a codepen I really like but I’m having trouble setting a transparent bg. I’ve taken a look at all the topics on here, and all the questions on stackoverdlow but I can’t get it working. I’ve tried adding , { alpha: true}, changing my scene and other things.

Here’s the codepen I’m trying to work with… [https://codepen.io/ramsaylanier/pen/raybzy](https://codepen.io/ramsaylanier/pen/raybzy)

Any help is greatly appreciated!

---

<div class="post-metadata">

### Author: ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)
#### Post date: [January 23, 2021, 6:45am UTC](https://discourse.threejs.org/t/transparent-background/22742/2 "2021-01-23T06:45:06Z")

</div>

I think there are a couple things missing there:

1. You do need `alpha: true` on the scene, as you mention.
2. Don’t change `setClearColor`.
3. If you’re using EffectComposer, there is some extra work required to make it allow a transparent background, see these comments. [three.js - How do I stop EffectComposer from destroying my transparent background? - Stack Overflow](https://stackoverflow.com/questions/20899326/how-do-i-stop-effectcomposer-from-destroying-my-transparent-background)

I’d recommend starting with `renderer.render( scene, camera )` instead of `composer.render()` just to make sure you have the first two parts working.

---

<div class="post-metadata">

### Author: ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)
#### Post date: [January 23, 2021, 6:48am UTC](https://discourse.threejs.org/t/transparent-background/22742/3 "2021-01-23T06:48:56Z")

</div>

/cc [javascript - Setting a transparent background with three.js - Stack Overflow](https://stackoverflow.com/questions/65856152/setting-a-transparent-background-with-three-js/65856532#65856532)
