Threejs Cannon-es Blender Rigger
Create and position physics colliders in Blender then export them as GLB and load them automatically in ThreeJs with Cannon-es.
bandinopla
Video
Three.js Marketplace
Three.js Marketplace
Kickstart your Three.js and React Three Fiber (R3F) projects with our free and premium components themes and tools. Designed for freelancers, developers, and agencies, each product includes essential features to get you up and running quickly.
Links
Featured Badge
Add this badge to your website to show you are featured on Three.js Resources.
Description
Design in Blender, simulate in Three!
Create and place physics colliders in Blender, export as GLB, and automatically set them up in three.js with cannon-es.
Watch Video Tutorial (Rigging a mechanical claw)
Demo showcase app that inspired this addon: Mechanical Claw Machine
This solution includes two tools:
A Blender addon for creating colliders in Blender
An NPM package to rig the physics in Three.js using cannon-es
Features
Automatically creates Cannon bodies for Three.js objects defined inside of Blender ( using the addon ).
Supports:
box and sphere colliders
hinge
point
distance
lock
glue childrens
synchronization (copy location & rotation)
✨ your own custom constraint ✨
Sponsors
Related Resources
Dat.gui
dat.GUI is a lightweight controller library for real-time adjustments in three.js resources.
Leva
Leva is a GUI library for creating intuitive controls in three.js resources and web projects.
Hology Engine
Create 3D games and experiences for web, mobile and VR by using web technologies with Hology Engine.
Cyango
All-in-one Experiences Builder. From 2D to 3D, you can build and export full mobile and web apps.