Writing your own shaders rather than stacking built-in materials until something looks close enough.
Install on its own
Or add it to your stack above and install everything at once.
npx skills add https://github.com/CloudAI-X/threejs-skills --skill threejs-shadersTrust audit
View the source ↗- Checked automatically and confirmed.
- Resolved (HTTP 200), passed
- Checked automatically and confirmed.
- Resolves · 3,917 stars, passed
- Checked automatically and confirmed.
- Transcribed from UI Skills, passed
- Checked automatically and confirmed.
- Credited to CloudAI-X, passed
Goes well with
webgl-components
Always-on WebGL visuals that survive being rendered fifty times in a list.
One shared context blitted into cheap 2D canvases, one rAF loop, IntersectionObserver gating, mipmaps, and real optics instead of painted ones. The failure modes are predictable and nearly all come from treating the widget like a demo.
npx skills add https://github.com/flornkm/skills --skill webgl-components
threejs-fundamentals
Scene setup: cameras, renderer config, hierarchy, transforms.
Where every Three.js project starts, and where a surprising number of them go wrong before anything is drawn.
npx skills add https://github.com/CloudAI-X/threejs-skills --skill threejs-fundamentals
threejs-geometry
Built-in shapes, BufferGeometry, custom meshes and instancing.
CloudAI-X3DPerformanceIncluding instancing, which is the difference between fifty objects and fifty draw calls.
npx skills add https://github.com/CloudAI-X/threejs-skills --skill threejs-geometry
Florian Kiem