Rive ✅
RELEASED in Sygnal Media v0.1.2
Webflow has a native Rive element, however the library version isn't always up to date with the Rive library. This component could
Goals
Provide current Rive capabilities, e.g. feather
Explore version safety, or the option to choose the Rive library version
As much as possible, match any integration capabilities
Demonstration
Properties
Rive URL
Asset or URL
Link to a .riv file in assets, or specify a URL to link to an external file.
Artboard
Text
Case-sensitive, must enter exactly. Unfortunately no pick list support.
State Machine
Text
Case-sensitive, must enter exactly. Unfortunately no pick list support.
Fit
Variant pick list
See below
Width
Text ( measure )
Height
Text ( measure )
Responsive
Boolean
Autoplay
Boolean
Lazy Load
Boolean
Fit
Contain: Animation scales to fit within bounds maintaining aspect ratio
Cover: Animation scales to fill entire container, may crop content
Fill: Animation stretches to fill container exactly, may distort
Fit Width: Animation scales to match container width
Fit Height: Animation scales to match container height
None: No scaling, uses original animation size
Scale Down: Like contain but never scales up, only down
Last updated