Allow SVG as Image Fill

I have a few SVG shapes as part of the branding for a project I am working on. I’m in the process of building out a component library and for the primary CTAs, one of the shapes will be the background for the CTA.


That white background would typically be a solid fill with border radius, and using Auto Layout would be able to grow and shrink based on the label overrides per instance.

However, I am unable to get an SVG working as the frame’s fill. It does allow me to “Choose image” and select the SVG but it never displays. From the docs, there is no mention of using SVG for this, as opposed to PNG, JPG, etc, and I don’t see why we can’t use an SVG as a fill.


Having the same issue trying to find a way to use SVG components within Auto Layouts

Support for SVG files as fill images would be super useful! Or even better, being able to use the “Copy as SVG” command, then select the target element and just paste.

Actually, I just found that this is already possible. Just select the frame and choose “Copy AS PNG”, and then paste to the target layer! Sweet!

Why bother? After creating a button with Auto Layout, we already know we can apply an Image Fill to a shape/frame as the button background.

The point of this post is to get SVG as Image Fill. Unless you can demonstrate that “Copy as SVG” > paste can work without breaking the button’s Auto Layout.

having pixel fills feels oddly out of time. svg fills would be neato.


this would be very useful thing! Manipulating svg fill (color!) would be such a timesaver. Exporting svg to png and finding out that something is wrong and has to be redone in the svg source file and AGAIN exported to png. Silly…


This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.