3 ms·
Just tried to edit this icon so that the arrow is in the center of the circle. The mask wasn't properly recognized and so it only shows a black circle: <svg xm
by Mystery-Machine 1y ago
Just tried to edit this icon so that the arrow is in the center of the circle. The mask wasn't properly recognized and so it only shows a black circle:
<svg xmlns="http://www.w3.org/2000/svg http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink http://www.w3.org/1999/xlink" width="20"
height="20" viewBox="0 0 20 20" stroke-width="2" stroke="black">
<circle cx="10" cy="10" r="10" fill="currentColor" mask="url(#maskArrow)"></circle>
<mask id="maskArrow">
<circle cx="10" cy="10" r="10" fill="white"></circle>
<path d="M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6l6 6l1.41-1.41z"></path>
</mask>
</svg>
- jansan 1y agoAs I wrote in the post above, masks and filters are not not supported, yet. For your icon a clip path may make more sense than a mask. If you want to create an icon with the same shape you can simply take the elements from the mask and paste them into Hyvector and work with that: <circle cx="10" cy="10" r="10" fill="white"></circle> <path d="M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6l6 6l1.41-1.41z"></path>