threenix-add-component
Add Three.js components with Threenix
Discover Threenix components and hooks through MCP, then add canonical source and assets to your React Three Fiber project.
What this skill does
- Find the right component, hook, or scene foundation from the live library.
- Retrieve canonical source, dependencies, assets, and integration guidance.
- Integrate with your existing scene and check compatibility and runtime behavior.
When to use it
Use it to add a named library resource or describe the scene feature you want. It also covers Canvas setup, TSL backgrounds, and first-reveal scene warmup.
Agent skill
Run this skill
$threenix-add-componentAfter invoking the skill, describe your task:
$threenix-add-component fireworks — add fireworks to my existing WebGPU scene.
Frequently asked questions
How does the skill choose a component?
It discovers the live library through list_components and retrieves the matching resource with get_component_reference. Supply a slug or describe your intended scene feature.
Does the skill require an MCP connection?
Yes. Source, assets, and resource-specific guidance come from the public Threenix MCP server. No API key is required. If access fails, the agent reports the problem.
Will it replace my existing scene?
It preserves compatible Canvas, camera, controls, postprocessing, and loading infrastructure. Canvas setup creates a new Canvas only when needed; renderer migration is a separate task.
How are source and assets installed?
The agent writes the returned production files, preserves relative paths, and downloads large asset collections directly to disk. It installs only missing dependencies and runs the relevant project and resource checks.