Home > Designing, Others > Preparing and Exporting SVG Icons in Sketch

Preparing and Exporting SVG Icons in Sketch

February 11th, 2017 Leave a comment Go to comments

There is an interesting gotcha about the fill-rule attribute of SVG, detailed here by Anthony Collurafici.

Fill-Rule is an SVG property that basically defines how to determine what shapes are filled or subtracted from the shape. The default SVG value is “nonzero”, and this is what Android requires. Unfortunately, Sketch uses “evenodd”. Luckily Sketch provides all the features we need to convert our shapes from “evenodd” to “nonzero”. And its now even easier in Sketch 42.

The direction you draw the points in nested shapes affects the fill.

Direct Link to ArticlePermalink


Preparing and Exporting SVG Icons in Sketch is a post from CSS-Tricks

Categories: Designing, Others Tags:
  1. No comments yet.
  1. No trackbacks yet.
You must be logged in to post a comment.