Streaming live at 10am (PST)

ThreeJS in Background

Hi guys,

I’m new to custom code. But I’m trying to implement a ThreeJS script as a background for a project.

It’s this JS:

As far I can see in the code, the only scripts I need are:

<script src="…/build/three.js"></script>
<script src=“js/WebGL.js”></script>
<script src=“js/libs/stats.min.js”></script>

So, in my Custom code header-section, I’ve linked to the full paths at Github, ie:

And added the javascript code in an embed, in a div in my body.

But it doesn’t work. Isn’t it as simple as that? Newbie-alert.

My project:

Hi there. I was doing some experiments and pulled this of

Found this Codepen that I made into a Webflow project:

Here’a the read only:

Does this help you in any way?

Edit: Doesn’t work in Safari.
Edit 2: It now works in safari. Changed custom canvas css width to 100%

It sure did!

I duplicated your structure, with the canvas and added the scripts (ref’s + full scripts) in the same embed/custom fields as you use. But it didn’t work yet. But …

Then, I downloaded the scripts from github, and uploaded to my own server, and magical things happened. All of a sudden everything worked out.

Thanks a lot for your help, jorn!



Holy Sh-it balls!
Clone please?

Done :slight_smile:

There you go! Awesome. Glad I could “help” :sweat_smile:

Don’t suppose you know how to make the background transparent for this effect? I’m trying to use the particles over a gradient rather than a fixed colour.

I’ll try to look into that.

Hmm, I tried a lot of things but didn’t pull trough. Sorry. @bart any ideas?

Has anyone had any luck using these as a background with content on top?

I’m struggling with putting content on top.


You can add content in the HeroWrapper which will place the content on top of the JS animation.

Hey @larshartmann

Thanks for your help. I got some of these three.js backgrounds to work, but not some other ones. I don’t know what I’m doing wrong.

Public link:
Source code for background:

Not working:
Public link:
Source code for background:

Any help would be appreciated, thanks in advance.