Help us improve
Share bugs, ideas, or general feedback.
From game-studio
Build React-hosted 3D browser games with React Three Fiber. Use when the user wants pmndrs-based scene composition, shared React state, and 3D HUD integration inside a React app.
npx claudepluginhub robinebers/converted-plugins --plugin game-studioHow this skill is triggered — by the user, by Claude, or both
Slash command
/game-studio:react-three-fiber-gameThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Use this skill when the 3D runtime lives inside a React application. This is the default React-native 3D path in the plugin and should be preferred over vanilla Three.js when the app shell, settings, storefront, editor surface, or surrounding product already uses React.
Mandates invoking relevant skills via tools before any response in coding sessions. Covers access, priorities, and adaptations for Claude Code, Copilot CLI, Gemini CLI.
Share bugs, ideas, or general feedback.
Use this skill when the 3D runtime lives inside a React application. This is the default React-native 3D path in the plugin and should be preferred over vanilla Three.js when the app shell, settings, storefront, editor surface, or surrounding product already uses React.
Recommended stack:
@react-three/fiberthree@react-three/drei@react-three/rapier@react-three/postprocessing@react-three/a11y when accessibility-sensitive interaction matters@react-three/rapier for physics integration.@react-three/postprocessing for optional effects.@react-three/a11y when the interaction model benefits from accessible scene semantics.Canvas with equally weighted glass cards.Canvas.../web-game-foundations/SKILL.md../game-ui-frontend/SKILL.md../../references/three-hud-layout-patterns.md../../references/react-three-fiber-stack.md../../references/react-three-fiber-starter.md../../references/gltf-loading-starter.md../../references/rapier-integration-starter.md../../references/web-3d-asset-pipeline.md../../references/webgl-debugging-and-performance.md