Transparency not rendered correctly in GIF?

[peteruithoven]

Using the latest v4.0.74 I'm trying to make a ping animation.
The following webm video gives an idea of what I'm going for:
Ping.webm

I'm planning to use this gif in Figma, so I can't just animate this just using some css.

But even though the background is transparent, the outer circle doesn't get transparent when I render it to a gif:

I've copied the project to StackBlitz, but sadly haven't figured out how to render from there:
https://stackblitz.com/edit/vitejs-vite-jokhgw?file=src%2FRoot.tsx

For rendering I've tried using:

• Codec: GIF
• Image Format: PNG
• Scale: 2x
• Pixel format: I've tried all except yuva420p
• Color space: tried both default and bt709 with a couple of pixel formats

[JonnyBurger]

We cannot support this because the GIF spec itself does not support partial transparency: https://stackoverflow.com/questions/1952376/how-to-get-better-transparency-with-gifs

[JonnyBurger]

Better + more references: ImageMagick/ImageMagick#6424 https://community.aseprite.org/t/i-need-to-make-a-gif-with-colors-that-become-transparent-or-semi-transparent-layers/7507

[peteruithoven]

Ahh 🤦 Thanks for the answer!