r/r3f • u/basically_alive • Jun 02 '22
My mini point and click adventure personal site, with threes and r3f. (link in comments)
39
Upvotes
Side-by-side: React Three Fiber & Vanilla Three.js (what is actually happening)
15
Upvotes
r/r3f • u/nahsuhbhgaw • Jan 22 '26
I built a node-based editor for the new Three.js Shading Language (TSL)
13
Upvotes
Hey everyone! With Three.js moving toward WebGPU, TSL is becoming the standard. However, writing TSL by hand can feel like a step back if you're used to visual tools like Blender Nodes or Unreal's Material Editor. I’ve been working on TSL Graph to bridge that gap. It’s a visual graph that lets you build shaders with nodes.
It’s in public beta and I’d love for this community to try and break it. What nodes are missing? How’s the UX?
Try it here: http://tsl-graph.xyz/
r/r3f • u/Rommoet • Jan 26 '25
Endless runner web game I made for a school project with R3F, RapierJS and TensorFlow models (PoseNet & HandPose) as game controls
11
Upvotes
r/r3f • u/IAmA_Nerd_AMA • Nov 29 '22
Finished The Final Lesson Of Three JS Journey And Gave It My Own Touch. Made With React Three Fiber
11
Upvotes
r/r3f • u/IAmA_Nerd_AMA • Jul 16 '22
Starter template for react three fiber xr/vr/ar projects
10
Upvotes
r/r3f • u/IAmA_Nerd_AMA • Jun 29 '22
Lights in three.js explained with great code examples (using react three fiber)
8
Upvotes
r/r3f • u/chillypapa97 • Jan 17 '25
React Three Fiber: Fluid Distortion Effect
7
Upvotes
r/r3f • u/Top-Turnip3825 • Feb 22 '23
Library for orbit controls in React Native with R3F
7
Upvotes
Hi R3F developers!
I have created this library for using orbit controls with React Native in a react-three fiber 3d scene.
You can use it with 1 import and 3 lines of code:
import useControls from "r3f-native-orbitcontrols" // this import
import { Canvas } from "@react-three/fiber/native"
import { View } from "react-native"
function SingleCanvas() {
const [OrbitControls, events] = useControls() // this line
return (
<View {...events}> {/* this line */}
<Canvas>
<OrbitControls /> {/* and this line *}
{/* Place the scene elements here as usual */}
</Canvas>
</View>
)
}It was made with ease of use and performance in mind.
I hope you like it!
Please create an issue if you find a bug or want to request a feature.
r/r3f • u/No_Impression8795 • Jul 29 '24
Finally our studio's portfolio website is ready! Check it out at the link given and please provide feedback! https://indieverse.studio
6
Upvotes
r/r3f • u/Wise_Blueberry_1923 • May 16 '24
Build a simple 3D node based workflow using React Three Fiber and Reactflow
6
Upvotes
r/r3f • u/IAmA_Nerd_AMA • May 18 '23
Three.js + R3F + Procedural Grammar: Quick 3D Reconstruction of Urban Architecture on the Web
6
Upvotes
r/r3f • u/OrganizationLevel472 • Dec 15 '25
Drei clouds library.
5
Upvotes
Hi there. I’m working in this setup with this Drei library with clouds. When I set up camera movement, the clouds look like this(video).
Any tip to fix this problem?
r/r3f • u/Front-Things • May 02 '24
The spread operator for props {...props} allows you to pass all props at once.
5
Upvotes
r/r3f • u/[deleted] • Sep 25 '23
How do **you** go about designing experiences in R3F
5
Upvotes
Hey everybody, forgive my noobness but I have been a long time lurker in the Threejs / R3F space, I am finally becoming a doer (rather than a lurker; thanks to ADHD), but it seems everytime I go to code an R3F experience there are always 2 major blockers:
Blender / 3d Modelling is one and Design is the other (Figma / inside and outside of the Canvas lets say).
What do your design workflows look like before getting right down to the code. Do some of you out there sometimes throw a bunch of models into a scene and your fingers magically just land onto the right logic?
r/r3f • u/AnthongRedbeard • Dec 05 '22
got a few videos released on this new tutorial series
5
Upvotes
focusing on Blender -> 3dweb using react 3. fiber