rive-interactive
CommunityInteractive vector animations with state machines.
Authorfreshtechbro
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill enables the creation and integration of complex, interactive vector animations directly into web applications, moving beyond simple timeline playback to incorporate logic and real-time data binding.
Core Features & Use Cases
- State Machine Animation: Design animations with distinct states and transitions for dynamic user interfaces.
- Two-Way Data Binding: Connect application data to animation properties (ViewModel API).
- Input Handling: Control animations via user interactions (hover, click) or application logic.
- Use Case: Build an animated button that visually responds to hover states, click events, and displays dynamic text content bound to user profile data.
Quick Start
Use the rive-interactive skill to create a basic animated button component in React.
Dependency Matrix
Required Modules
rive-react
Components
scriptsreferencesassets
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: rive-interactive Download link: https://github.com/freshtechbro/claudedesignskills/archive/main.zip#rive-interactive Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.