rive-generator
✓Trigger when: (1) User wants to create a Rive animation programmatically, (2) User mentions "generate .riv file" or "create Rive animation", (3) User wants to see a visual animation created from code, (4) Working with the rive-generator project. Generate .riv files programmatically using TypeScript. Creates static shapes and animations. Requires npm package @stevysmith/rive-generator.
Installation
SKILL.md
| addArtboard(options) | Add an artboard (canvas) | | addNode(parent, options) | Add a transform group | | addShape(parent, options) | Add a shape container | | addEllipse(shape, options) | Add an ellipse/circle | | addRectangle(shape, options) | Add a rectangle | | addPointsPath(shape, options) | Add a custom vector path |
| addVertex(path, options) | Add a straight vertex | | addFill(shape, options) | Add a fill | | addStroke(shape, options) | Add a stroke | | addSolidColor(paint, color) | Set solid color | | addLinearGradient(paint, options) | Add linear gradient | | addRadialGradient(paint, options) | Add radial gradient |
| addGradientStop(gradient, options) | Add gradient color stop | | addLinearAnimation(artboard, options) | Add an animation | | addKeyedObject(animation, targetId) | Link animation to object | | addKeyedProperty(keyedObject, propertyKey) | Specify property to animate | | addKeyFrameDouble(keyedProperty, options) | Add a keyframe |
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/stevysmith/rive-skills --skill rive-generator- Source
- stevysmith/rive-skills
- Category
- </>Dev Tools
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is rive-generator?
Trigger when: (1) User wants to create a Rive animation programmatically, (2) User mentions "generate .riv file" or "create Rive animation", (3) User wants to see a visual animation created from code, (4) Working with the rive-generator project. Generate .riv files programmatically using TypeScript. Creates static shapes and animations. Requires npm package @stevysmith/rive-generator. Source: stevysmith/rive-skills.
How do I install rive-generator?
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-generator 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
- </>Dev Tools
- Source
- skills.sh
- First Seen
- 2026-02-01