Examples
A few examples that demonstrate what you can do with React Three Fiber
Showcase
Room with soft shadows
causticseffectssoft-shadowsT-Shirt configurator
configuratort-shirtsoft-shadowsFrosted glass
frostedglasstransmissionCaustics
causticseffectssoft-shadows
GLTFJSX 400kb drone
gltfjsxeffectsbloomsoft-shadowsMonitors
effectsbloomdofreflectionsStarwars
effectsreflectionsssrbloomBruno Simons 20k challenge
rapierphysicssoft-shadowsScrollcontrols and lens refraction
scrollrefractionlensUsing render texture through decals (forked)
gltfjsxeffectsbloomsoft-shadowsSpline glass shapes
gltfjsxeffectsbloomsoft-shadowsCSG bunny, useGroups
gltfjsxeffectsbloomsoft-shadowsCSG house
gltfjsxeffectsbloomsoft-shadowsBuilding dynamic envmaps
Inter, epoxy resin
Stage presets, gltfjsx
Nextjs prism
HTML Input fields
Interactive spline scene + live HTML
Diamond refraction
React EllipseCurve
Iridescent decals
Baking soft shadows
SSR Test
CSG operations + Rapier physics
Faucets, select highlight
Rapier physics
Envmap ground projection
SSR Rover
bloom hdr workflow, GLTF
Ground projected envmaps + lamina
Basic ballpit
Backdrop and cables
Figma noodles
Building live envmaps
Fairly realistic grass
Clones
lamina 1.x
Object clump
React-pp outlines
LGL Raytracer
Gatsby stars
Layer materials
Pmndrs + Vercel
Sport hall
Image Gallery
Reflector variant
Night train
ThreeJS Journey - Level 1
Bouncy watch
Horizontal tiles
Transparent aesop bottles
M1 scrollcontrols
Raycast cycling
Landing page.
UseIntersect and scrollcontrols
Infinite scroll
Scrollcontrols with minimap
Scrollcontrols + GLTF
Merged Instance
GPGPU Curl-noise + DOF
Hi-key bubbles
Floating, instanced shoes.
Threejs journey
Simple audio analyser
BestServedBold Christmas Baubles
Mixing HTML and WebGL w/ occlusion
Performance scaling
Staging models
Camera Scroll
Shoe configurator
Minimap
Springy boxes
Floating diamonds
GLTF Animations
Sparks and effects
Audio analyser
Ground reflections and video textures
Circling birds
Adaptive lightmaps
Jointwork with ARC4G
Camera shake
Ragdoll physics
React-spring animations
Aesop bottles
Mount transitions
Floating laptop
Zustand site
Baked AO
Cell fracture
Router transitions
Ballpit
Soft shadows
Lulaby city
Viking ship
Exploding crystal
Wobbling sphere
The three graces
Moksha
Flexbox/Yoga in Webgl
Confetti
Learn with Jason
Volumetric light
Hi-key bubbles
Volumetric spotlight
Magic mirror
Reflectorplanes and bloom
Game prototypes
Racing game
Pinball in 70 lines
space game
Minecraft
Arkanoid
Ping-pong
Arkanoid under 60 LOC
Raycast vehicle
Basic examples
Basic demo
ASCII renderer
Pixelated render pass
drei/RenderTexture
Environment blur and transitions
Pairing Threejs to UI
Inverted stencil buffer
Stencil mask
TransformControls and makeDefault
Bounds and makeDefault
Instanced vertex-colors
Progressive loading states with suspense
GLTF Animations re-used
Re-using GLTFs
SVG-renderer
Mixing HTML and Webgl
Viewcube
Mixing controls
Video textures
Sky dome with annotations
Tying canvas to scroll-offset
EdgesGeometry
HTML annotations
Shadermaterials
Simple physics demo.
Trigger meshes
Simple physics demo with debug bounds
Selective outlines
Instances
Physics with convex-polyhedrons
Color grading
Grass shader
Clouds
SVG maps with HTML annotations
Re-using geometry and level of detail
HTML Markers
Bezier curves & nodes
Shader fire
Water shader
Staging and CameraShake
Glass transmission
Spherical word-cloud
Shader HMR