transparent gradient in a photo

Saola Animate Support Questions
1

Problem: transparent gradient in a photo

Saola Animate version: 2.7.1

OS: Mac

Notes: How do I make a transparent gradient in a photo. It goes on a shape, but I can’t get it on a photo.

Thanks

2

Hi,

If your background has a solid color, you can set a transparent gradient for a div or shape element, then make it cover over your photo.
Otherwise, you can use CSS mask-image property.

mask
mask700×440 65.8 KB

Please read this tutorial if you don’t know how to use CSS in Saola Animate yet: https://atomisystems.com/html5-animation/using-css-to-create-text-effects/

Sample project: mask.saolapack (41.9 KB)

Regards