Skip to main content
M
1y ago

Changing colors at runtime

Im using Rive in react and wondering how I can change the color of Rive objects at runtime. In the Rive editor there is the selected colors, which is nice to be able to change colors quickly, but is it possible to access this information at runtime? Ive seen some people create number inputs for "red", "green", and "blue" using the "Color Dodge" option in the layer (shown in image). Then use the inputs to control the rgb of the object, but its not very scalable. Is there a better way to do this?

4 replies
c
L
S
+1
1y ago

We don't provide an API to update colors at this stage for our runtimes.

Flutter and c++ are the only runtimes that you can delve into the internals to update some components, including the fills - see this issue: https://github.com/rive-app/rive-flutter/issues/287

If you only want to only support a few different colors, you can achieve it through a state machine input and updating the animation.

L
8mo ago

Hello, this is also a need for us, as we'd like to create Rive components where we can change colors through inputs or runtime. No evolution on this since that time?

S
6mo ago

would it not be possible to expose any parameter to override in react?

c
3mo ago

Is there any plan to offer an API in JavaScript of a similar level to flutter or any alternative method to dynamically change fills and gradients?