rive-web
✓Trigger when: (1) Loading or embedding .riv files on the web, (2) Using @rive-app/canvas or @rive-app/webgl packages, (3) Controlling Rive state machines from JavaScript, (4) Reading/writing Rive inputs or handling events, (5) User mentions "Rive runtime" or "Rive animation" in web context. Best practices for embedding and controlling Rive animations on the web using the official Rive JavaScript/TypeScript runtime.
Installation
SKILL.md
Embed and control Rive animations on the web with JavaScript/TypeScript.
| Rive Instance | Main controller for the animation | | State Machine | Interactive logic built in Rive editor | | Inputs | Variables to control state machine (Boolean, Number, Trigger) | | Events | Signals fired by the state machine | | Artboard | Container for animation content |
@file rules/loading.md @file rules/state-machines.md @file rules/inputs.md
Trigger when: (1) Loading or embedding .riv files on the web, (2) Using @rive-app/canvas or @rive-app/webgl packages, (3) Controlling Rive state machines from JavaScript, (4) Reading/writing Rive inputs or handling events, (5) User mentions "Rive runtime" or "Rive animation" in web context. Best practices for embedding and controlling Rive animations on the web using the official Rive JavaScript/TypeScript runtime. Source: stevysmith/rive-skills.
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/stevysmith/rive-skills --skill rive-web- Source
- stevysmith/rive-skills
- Category
- *Creative Media
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is rive-web?
Trigger when: (1) Loading or embedding .riv files on the web, (2) Using @rive-app/canvas or @rive-app/webgl packages, (3) Controlling Rive state machines from JavaScript, (4) Reading/writing Rive inputs or handling events, (5) User mentions "Rive runtime" or "Rive animation" in web context. Best practices for embedding and controlling Rive animations on the web using the official Rive JavaScript/TypeScript runtime. Source: stevysmith/rive-skills.
How do I install rive-web?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/stevysmith/rive-skills --skill rive-web Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/stevysmith/rive-skills
Details
- Category
- *Creative Media
- Source
- skills.sh
- First Seen
- 2026-02-01