# Rollshade > Ready-made spell and attack effects for three.js (WebGPURenderer + TSL), published on npm as `rollshade` (MIT). One call plays a whole move (charge-up, travel, impact, smoke, lights, bloom, camera shake) and reports each hit to the game. The site https://rollshade.tsuyatt.com/ lets people browse, tune and export effects; everything exported is CC0. Install with `npm i rollshade three@0.186` (three r186). Use `THREE.WebGPURenderer` from `three/webgpu`; it falls back to WebGL2. Core API: `new FXSystem({ scene, camera, renderer, post: true, feel: true })`, `fx.add(effect('meteor', 'fire'))`, `await fx.prewarm()`, `fx.play('fire-meteor', { from, to }).on('hit', e => ...)`, and every frame `fx.update(dt)` then `fx.render()`. Recipes: projectile, lance, beam, explosion, pillar, meteor, nova, barrier, shockwave, summon, missiles, tornado, storm, drill, slash, thrust, spin, cross, smash, iaido, strike, heal, buff, warp, finale. Elements: fire, ice, thunder, wind, earth, water, light, dark, poison, arcane. Status effects on any mesh or character, `fx.status(target, name)`: burn, freeze, shock, poison, petrify, dissolve, appear, bless, curse, shield, stun. Placed loops, `fx.loop(name, at)`: torch, campfire, candles, portal, sigil, savepoint, barrier, aura, beacon. ## Docs - [Full reference](https://rollshade.tsuyatt.com/llms-full.txt): install, quick start, every move with its from/to anchors, variations, events, options and rules that avoid common bugs - [npm package](https://www.npmjs.com/package/rollshade): the runtime; ships an agent skill at `skills/rollshade/SKILL.md` ## Optional - [Guide](https://rollshade.tsuyatt.com/guide/): using exported effects, looping effects and sprite sheets - [Gallery](https://rollshade.tsuyatt.com/gallery/): looping effects by theme - [Demo](https://rollshade.tsuyatt.com/demo/): a small magic arena game built with the package