SVG Scaling When Used With Image Managemenet Tool

When SVGs are used with the image management tool, they are scaled with anti-aliasing. This would be desirable for a PNG or JPG but not for an SVG where you can get lossless scaling. It also distorts the color swap filter because the anti-aliasing changes the color around the edges.

here is an example (yellow highlighting added)

Is there a way to change this behavior so it can scale smoothly? It’s not a big deal for the image component since I can put the SVG in directly (although I do like being able to have the images in one place where I can update them if needed.), but for buttons and similar it’s pretty annoying.

1 Like

Yes Observed the same, Are there any ways to resolve this distortion for svg when using along with vision image component.

We make vision templates for our svgs, with the layout settings configured to keep things scaled.

Hi @bmusson, Thanks for prompt response. If i understood well, You have used separate vision template for svg’s. Have you used image component? Because in my situation, I need to pass dynamic image paths, So I don’t get any idea apart from using image component for having dynamic paths pointing svg’s. As mentioned only problem with this method is svg’s get distorted when using along with image component.

If every icon has a template, you can use a Template Path binding to swap icons.