Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Using THREE.js in a Houdini Paint

This is weird and terrible.

We use a THREE.js Canvas Renderer in a paint worklet!!

The worklet code is in main.js

Use npm run start to build it.

Use it in HTML like so:

<style>
  .some-el {
    --rotate-x: 0;
    --rotate-y: 0;
    --rotate-z: 0;
  
    background-color: lavenderblush;
    background-image: paint(three);
  }
</style>

<script>
  CSS.paintWorklet.addModule('./dist/bundle.js');
<script>

Preview

About

Demo using THREE.js to render into a Houdini Paint Worklet

Topics

Resources

Releases

No releases published

Packages

No packages published