# React Three Rapier

> Rapier physics for react-three-fiber scenes: wrap the mesh and it falls and collides

Worth exploring: Wrap a mesh in a RigidBody inside a Physics and it falls and collides with no manual animation

Why it works: Colliders come from the mesh itself, so objects fall, hit and stack by physics rules and a scene feels physical with almost no animation code.

Watch out: Mind the versions: v2 needs R3F v9 and React 19, v1 is for React 18. Keep the fixed time step, since a variable one can make the simulation unstable.

- Category: 3D & WebGL (`three`)
- Tags: `open-source`, `free`, `react`, `webgl`
- Official: https://github.com/pmndrs/react-three-rapier
- Wunderlust: https://wunderlust.xyz/r/react-three-rapier
- Image: https://wunderlust.xyz/media/react-three-rapier-poster.jpg
- Video preview: https://wunderlust.xyz/media/react-three-rapier.webm
- Added: 2026-11-12

## What it is

A wrapper for the WASM-based Rapier physics engine in react-three-fiber. The Physics component runs the simulation and RigidBody generates colliders automatically (cuboid, ball, trimesh, hull); it also covers joints, sensors, collision groups, instances and a debug view.

## What it’s for

For someone building a 3D scene in React who wants objects that fall, hit and stack without animating frame by frame.

## Benefits

- Colliders generated from the mesh
- Fixed, spherical, revolute, prismatic, rope and spring joints
- Collision events and sensors, with a fixed 60 fps step by default

## Caveats

- Version 2 needs @react-three/fiber v9 and React 19; v1 is for React 18.
- With timeStep set to vary, the simulation can become unstable and non-deterministic.

## Similar on Wunderlust

- [React Three Fiber](https://wunderlust.xyz/r/react-three-fiber.md): React renderer for Three.js: 3D scenes as JSX components
- [React Postprocessing](https://wunderlust.xyz/r/react-postprocessing.md): Screen effects as React components: bloom, depth of field, noise and vignette
- [multipleWindow3dScene](https://wunderlust.xyz/r/multiple-window-3d-scene.md): A three.js scene synced across several browser windows with only localStorage
- [Three.js](https://wunderlust.xyz/r/three-js.md): JavaScript library for 3D graphics on the web
- [Spline](https://wunderlust.xyz/r/spline.md): Browser 3D tool for creating interactive scenes and publishing them to the web
- [Shader Gradient](https://wunderlust.xyz/r/shadergradient.md): Animated 3D gradients for React, Framer and Figma