After Effects x Bodymovin x Lottie Gradients — Black & white rendering issue

Hey guys,

I’ve been seeing/having an issue with bodymovin and after effects rendering a gradient (.json) for an app we’re working on.

I spent 2 hours playing with the json file trying to figure out why my gradient was black & white

From AE, the json file rendered from Bodymovin had those k values for the gradient :
“k”:[0,1,1,1,1,1,1,1]
I assumed it was something like: Color1,r,g,b,Color2,r,g,b

I replaced that using my RGB colors to be sure my gradient works:

Taking R divided by 255, then G / 255 etc…
I got that:
“k”:[0,0.85,0.27,0.98,1,0.26,0.93,0.99]

It worked…

=> Next step was understanding why ae/bodymovin output for my gradient was black&white

Not sure if that’s fully effective but on my first try at it that seemed to be working:

In after effects, Go to your gradient colors and make sure you clicked RGB instead of TSL. Do a render again and you’re all set. No more black and white!! Otherwise back to dividing your R,G and B values by 255 and replace that in your .json

Hope that will help you :)

If you’d like to show support, leave a clap, a comment and check-out my design and development studio : mad.studio 🚀