Back to tags
Tag

Agent Skills with tag: react-three-fiber

6 skills match this tag. Use tags to discover related Agent Skills and explore similar workflows.

postfx-bloom

Bloom and glow effects using Three.js UnrealBloomPass with React Three Fiber. Use when implementing glow, bloom, luminance-based effects, selective bloom on specific meshes, or neon/ethereal lighting. Essential for cyberpunk aesthetics, energy effects, magic spells, and UI glow.

threejsreact-three-fiberpost-processingbloom
Bbeierle12
Bbeierle12
3

immersive-visuals-router

Master router for immersive visual experiences combining React Three Fiber, shaders, particles, post-processing, GSAP animation, and audio. Use when building 3D web experiences, visualizers, creative coding projects, interactive installations, or any project requiring multiple visual technologies. Dispatches to 6 specialized domain routers covering 29 total skills.

react-three-fibershader-programmingparticle-systemspost-processing
Bbeierle12
Bbeierle12
3

r3f-geometry

BufferGeometry creation, built-in geometries, custom geometry with buffer attributes, instanced meshes for rendering thousands of objects, and geometry manipulation. Use when creating custom shapes, optimizing with instancing, or working with vertex data directly.

three.jsreact-three-fiberbuffergeometryinstancing
Bbeierle12
Bbeierle12
3

r3f-router

Decision framework for React Three Fiber projects. Routes to specialized R3F skills (fundamentals, geometry, materials, performance, drei) based on task requirements. Use when starting an R3F project or needing guidance on which R3F skills to combine.

react-three-fiberdecision-frameworkthreejsreact
Bbeierle12
Bbeierle12
3

r3f-fundamentals

React Three Fiber core setup, Canvas configuration, scene hierarchy, camera systems, lighting, render loop, and React integration patterns. Use when setting up a new R3F project, configuring the Canvas component, managing scene structure, or understanding the declarative Three.js-in-React paradigm. The foundational skill that all other R3F skills depend on.

reactthreejsreact-three-fibercanvas
Bbeierle12
Bbeierle12
3

r3f-drei

@react-three/drei helper library—OrbitControls, Text, Environment, useTexture, useGLTF, Html, Billboard, and 50+ abstractions that simplify common R3F patterns. Use when implementing camera controls, loading assets, rendering text, or needing common 3D utilities.

react-three-fiberthreejs3d-graphics3d-utilities
Bbeierle12
Bbeierle12
3