And to create the gif…
the image file for the anvil loading spinner is here: https://anvil.works/ide/img/loading.gif
You can do the following for a quick solution:
visit: https://ezgif.com/effects
use the link to upload the gif: https://anvil.works/ide/img/loading.gif
change the hue/saturation/lightness: see formula below
then Scroll down - hit apply and
Right-click - save image as… then follow the suggestion above from @stefano.menci
or upload it to the relevant project in your assets and in theme.css
do
#loadingSpinner {
background-image: url(_/theme/spinner.gif);
}
for the Hue Saturation Lightness Slider values:
get the desired HSL of the color you want I used: http://colorizer.org/ to convert the RGB to HSL
(or just type "#FF9800 to HSL"
in google)
#FF9800 --> hsl(35.8, 100%, 50%) --> h = 35.8, s=100, l = 50
try:
hue: (100+200/360*(h-209))%200 = 3
sat: 100 + 2*(s-57) = 186
lightnes: 100 + 2*(l-53) = 94
I’m not sure this is exactly right but it should get you close enough