Ver React Three Fiber en GitHub
React Three Fiber es un renderizador de React para Three.js, la popular biblioteca 3D para la web. Lo crea el colectivo de código abierto Poimandres (pmndrs).
No es una skill de agente, sino una biblioteca de código. Tú describes la escena 3D que quieres y tu agente de IA escribe los componentes.
Es gratuito con licencia MIT. El 28 de octubre de 2026 el repositorio tenía unas 33.000 estrellas en GitHub.
Qué hace
- Cada objeto de Three.js se convierte en un elemento JSX: una malla, una luz o una cámara se escriben como cualquier otro componente.
- Los objetos pueden reaccionar al estado, a los clics y al hover, y cada uno puede ejecutar su propia animación en cada fotograma.
- Según el README, todo lo que funciona en Three.js funciona aquí, sin sobrecarga, porque la escena se renderiza fuera de React.
- También funciona en React Native.
Qué puedes añadir con él
Un modelo de producto que el visitante puede girar, una sección principal en 3D o un pequeño objeto animado detrás de un titular. A su alrededor hay un gran ecosistema: Drei aporta ayudas listas para usar, y otros paquetes añaden efectos de posprocesado, física y VR o AR.
Qué saber antes
La versión debe coincidir con tu versión de React: la 8 funciona con React 18 y la 9 con React 19. El README también dice que conviene conocer React y Three.js antes de empezar. Aunque un agente escriba el código, ayuda entender lo que construye. Una escena 3D también hace la página más pesada, así que revisa cómo carga en móviles.
Cómo instalarla
npm install three @types/three @react-three/fiberLuego pide a tu agente la escena que quieres, por ejemplo un modelo de tu producto que gire al arrastrarlo.