Custom SF Symbol gets error "not interpolatable"

I'm trying to make a custom SF Symbol. I've made some new custom symbols successfully, combining existing SF Symbols, so I understand the process. But as soon as I use vector files from my previous work, I get the error, "The provided variants are not interpolatable." - even though it has shapes made with vector path.

  1. Template set up - Variable
  2. I use sketch to work on the template
  3. I have separate layers for Ultralight-S, Regular-S, Black-S

  1. File saved as SVG

What is wrong with my template?

Thanks!

Up vote post of JunoBerlin Down vote post of JunoBerlin
791 views
Posted by
JunoBerlin
Reply

  • I'm running in to the same issue using Figma and creating a custom icon. I try to create the different weights by adding a stroke to the custom icon and then outlining the stroke and flattening the icon. If I just add the icon in to the different weight groups without editing it then it works fine and validates. It's once I start editing the icon and try to make it thicker or thinner that I think it doesn't work. If you figure out what the solution is let me know.

    —
    bbmettler
Add a Comment

Replies

From my experiences so far, there needs to be a one-to-one relationship between vertices with the three weights. This way the engine can match up where to interpolate between the other weights. I'm still experimenting myself, but I wish there was an obvious way to manually set this relationship.

I seem to find success if I simply scale a path to make the shape appear thicker or thinner (command-K in Sketch). However, this does not always give a good result compared to say, "offset" of a path.

Posted by
jwarrent
Up vote reply of jwarrent Down vote reply of jwarrent
Add a Comment