[SVG files look good locally, but the middle becomes blurry when uploaded to wikipedia]

Quick update: Thank you for the responses! It seems like it wasn't my files so much as how wikipedia handles the images, after clearing my cache they looked good.

[SVG files look good locally, but the middle becomes blurry when uploaded to wikipedia]

Preview of the problem, left is what the file looks like in a browser when I open it locally, right is after I upload it to wikipedia

What I wanted to happen: Make SVG icons I can use on wikipedia that look good

What happened instead: Even though the SVG files look good when I open them locally in a browser, after uploaded to wikipedia the middle graphics become blurry but the outline stays sharp.

Steps to create to problem: I was just supposed to change the frame colour of an existing SVG image. So the outline that has stayed sharped is a shape I created in Affinity Designer, but the middle portion which has become blurry is imported from a previous artist's work. I exported the image as SVG (digital) using Affinity Designer.

Steps to fix the problem: ???