R3F SOP

Appearance

Getting Started ​

Fresh

React Three Fiber is a React renderer for three.js. Build your 3D scenes declaratively with re-usable, self-contained components that react to state, are readily interactive, and can participate in React's ecosystem.

In This Section ​

  • Introduction - What R3F is, why it exists, and the ecosystem around it
  • Installation - How to install R3F with Vite, Next.js, CDN, or React Native
  • Your First Scene - Step-by-step guide to your first 3D scene in React
  • Examples - Showcase of what you can build with R3F
  • Community Components - Third-party R3F components from the community

Quick Install ​

bash
npm install three @react-three/fiber

R3F pairs with a major version of React:

  • @react-three/fiber@8 pairs with react@18
  • @react-three/fiber@9 pairs with react@19