How to use the Ice and Frost VFX agent skill

What the skill makes the agent build

The skill is for the effect half of an ice or frost ability: what forms around the caster, what spreads across the ground, what erupts, what the wind does and what breaks. Frost is grown once on the CPU as a branching tree from a seed point, then revealed on screen by the time the growth front reached each point, so it appears to grow rather than scroll or repeat.

Ice spikes are built from flat planes and rendered by tracing light against those same planes, which gives refraction, reflection, blue tint with depth, bubbles and internal cracks. The spikes can crack along visible planes and then shatter into pieces that tumble and settle on a face.

The skill also covers a low freezing mist, a blizzard column of powder, glinting diamond dust and a snow floor lit by a raking moon.

• Frost creep: a dendritic frost pattern growing outward from a seed point
• Ice spikes and walls that erupt, crack and shatter
• Freezing mist, blizzards and snow devils driven by one shared wind field
• Snow floor with dunes, broken crust and glints

Install the ice and frost skill

Download the ZIP for the skill from the page, then unzip it into one of two places. For a personal setup, use the skills folder in your home directory, ~/.claude/skills/. For a single project, put it in that project's .claude/skills/ folder.

If you use the Claude apps instead, upload the skill under Settings, then Capabilities, then Skills.

The skill folder should contain SKILL.md at its top level, along with agents/openai.yaml, assets/, demo/, references/ and the files listed on the page.

• Personal: ~/.claude/skills/
• Project: .claude/skills/ inside your project
• Claude apps: Settings, Capabilities, Skills, then upload

Check what you need before you start

The effects run in Three.js and need a browser with WebGL2 support. The reuse modules expect you to pass in your own Three.js object, so they fit a Three.js or WebGL project. If you are not using that stack, this skill will not help you directly.

To run demo/build.mjs and rebuild the demo page, you need Node.js. No API keys or accounts are required.

• Three.js (MIT licence)
• A WebGL2-capable browser
• Node.js, to run demo/build.mjs
• No API keys or accounts

Trigger the skill with natural requests

Name the skill directly or describe the effect you want. The skill's description lists the kinds of requests it matches, including ice or frost skills, frost novas, ice spikes or walls, glacial eruptions, shattering ice, blizzards, snow devils, freezing mist, frozen ground, frost creep, ice shards, realistic ice and skill effects only.

The shared demo prompt shows the direct form, which names the skill with a dollar sign and then describes the effect and its tone.

• Use the ice and frost skill to give my ice caster effects that stay dynamic but never in your face.
• Make a frost creep from the cast point that grows outward and settles into hairline frost.
• Add ice shards that erupt along the frost line, crack, then shatter and rest on the snow.
• Build a blizzard column and freezing mist around the ice, with skill effects only and no character.

Use the reusable modules in your own project

The skill ships two JavaScript modules, frost-growth.mjs and frost-energy.mjs. Copy them side by side, because the energy module imports the growth module by relative path. Pass in your own THREE, renderer, scene and camera. The source says the modules do not import a second copy of Three.js.

The file list on the page includes assets/frost-growth.mjs but does not list assets/frost-energy.mjs, even though SKILL.md tells the agent to copy it. Check that your download contains both files before you rely on the example below.

• Create the effect with createFrostEnergy, passing your renderer, scene, camera and a seed.
• Grow the frost once with growFrostField, giving a seed point, a direction, a reach and a ground area.
• Create spikes with createSpike, then call buildObstacles so mist and snow can react to them.
• Advance the clocks each frame and call render, then crack and shatter spikes with crackSpike.

Run the five-beat demo and its failure-mode switch

The demo is a five-beat sequence on a scanned snow floor. The floor texture is Poly Haven's Snow 02 by Rob Tuytel under the CC0 licence. The build step embeds the textures as data URIs, so the finished page can be opened straight from disk without a server.

The demo includes a failure-mode switch. Use it to see how the effect looks when a component misbehaves, which helps you judge what to check in your own version. Run the build with Node.js first, then open the page from its folder.

• Five beats, from the first frost creep through the spikes and blizzard
• Failure-mode switch for checking how the effect breaks
• Built page opens from disk; the Three.js build is loaded from the local folder

Safety notes before you run the code

The skill runs scripts, specifically demo/build.mjs. The source says it uses no network access. The code has not been reviewed by the publisher of this guide, so read it before running it.

The demo loads a bundled Three.js build from the local folder. Do not run the demo or modules on untrusted input.

• Runs scripts: yes (demo/build.mjs and the demo page)
• Uses network: no
• Code is not reviewed here; read it before running
• Do not feed untrusted input to the demo or modules