Custom symbols are distorted on the Widget Controller

SaraJL

Hello!

I'm trying to add custom symbols to the widget controller in Experience Builder - but I'm having some difficulty with distortion (I'll attach a video)

2026-09-10 10-49-43.mp4

I was originally trying to duplicate the symbols on the map (I'll attach the files for those as well) - they end up being REALLY tiny, or if I add one without a background or outline, it's compressing the shape.

AED Locations.PNG

AED Icon Version 2.PNG

In the version 2 - I completely removed the surrounding border to just the picture. That is the one that is getting distorted in the import. It's supposed to look like this:

I suspect that the first version (heart with the circle border) is as close as it's going to get, which is fine. It's just the second icon that is little curious on why it's distorting the image so much.

Hopefully that makes sense.

Thank you!

JenniferAcunto

It is likely getting distorted because the image is not square. The red icon has an aspect ratio of 4:3. Make sure your icons have a 1:1 aspect ratio for the best results.

You can view the dimension of your image by right-clicking the file in Windows and viewing the properties.