EnzeDCommunity·11 Agent Skills Included

r3f-skills

Build correct React Three Fiber 3D scenes faster

Guides the building of React Three Fiber scenes with current, version-compatible APIs for geometry, materials, lighting, textures, shaders, animation, physics, and postprocessing. Prevents common mistakes like broken color spaces, leaked GPU resources, wrong collider sizes, and outdated Three.js patterns. Each skill includes a type-checked example and decision rules so agents pick the right API for the installed package versions.

108|7

↗

npx skills add EnzeD/r3f-skills --all -g -y

All Skills in This Repository (11)

Pure Emerald Level Indicators

📦 In Repo

EnzeD

r3f-physics

Simulate physics in React Three Fiber scenes with Rapier.

r3f-loaders

Load GLTF models and assets in React Three Fiber with Suspense.

r3f-postprocessing

Automates post-processing effects for React Three Fiber scenes using EffectComposer and @react-three/postprocessing.

r3f-interaction

Standardize pointer events, selection, and camera controls in React Three Fiber scenes.

r3f-textures

Load and configure textures in React Three Fiber projects.

r3f-shaders

Integrate custom GLSL shaders into React Three Fiber projects with shaderMaterial patterns.

r3f-geometry

Construct and render 3D geometries in React Three Fiber with JSX components, BufferGeometry, and instancing.

r3f-lighting

Guide React Three Fiber scenes through lighting, shadows, and environment integration.

r3f-animation

Orchestrate frame-driven animations for React Three Fiber objects and scenes.

r3f-fundamentals

Set up and animate 3D scenes in React with React Three Fiber.

r3f-materials

Configure React Three Fiber PBR, Drei, and shader materials with texture integration.

Community

Intermediate

Frequently Asked Questions

FAQPage Schema

How to install r3f-skills?▼

Run `npx skills add EnzeD/r3f-skills --all -g -y` in your terminal to install all eleven skills globally.

What does r3f-skills cover?▼

It covers the full React Three Fiber workflow: scene setup, geometry, materials, lighting, textures, loaders, animation, shaders, postprocessing, interaction, and Rapier physics.

Which React Three Fiber versions are supported?▼

The skills are verified against Fiber 9 with React 19 and Three.js r185, and each skill tells the agent to check your project's installed versions before choosing APIs.

Does r3f-skills work with Claude Code and Codex?▼

Yes. Every skill follows the standard SKILL.md format and works in Claude Code, Codex, and other compatible coding agents.

Can I install only one r3f skill?▼

Yes. Each of the eleven skills is independently installable, so you can add only the topics your project needs, such as shaders or physics.