Microphone icons do not work inside Figma

[Federico Terzi]

Hey @lucaburgio,

Thank you for the tremendous work on Iconoir, it's by far my favorite icon set available!
I wanted to report something that could be considered a bug with the microphone icons. In particular, if you try to "copy SVG" from the website, you can't paste it on Figma (tested on both Windows and macOS).
Also trying to drop the SVG file results in this error, so there is a chance the SVG is corrupted for some reason

This does not happen with other icons I've tested

Prerequisites

• Version: latest version on iconoir.com
• Are you running from source/main: from the website
• Are you using a released build: from the website
• Operating system: happens on Windows and macOS

Step to reproduce

1. Go to iconoir.com
2. Search for "microphone" icons
3. Copy to SVG
4. Try to paste on Figma

Any message or error

When dropping the file

Let me know if I can help you further, and thank you for the amazing work 🙏

Upvote & Fund

• We're using Polar.sh so you can upvote and help fund this issue.
• We receive the funding once the issue is completed & confirmed by you.
• Thank you in advance for helping prioritize & fund our backlog.

[Federico Terzi]

@lucaburgio I've investigated further and tracked down the problem: it seems that the microphone SVGs have an invalid, redundant stroke-width attribute:

<?xml version="1.0" encoding="UTF-8"?>
<svg width="18px" height="18px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"
    color="#000000" stroke-width="2">
    <rect x="9" y="2" width="6" height="12" rx="3" fill="#000000" stroke="#000000" stroke-width="2"
        stroke-width="1.5"></rect>
    <path d="M5 10V11C5 14.866 8.13401 18 12 18V18V18C15.866 18 19 14.866 19 11V10" stroke="#000000"
        stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
    <path d="M12 18V22M12 22H9M12 22H15" stroke="#000000" stroke-width="2" stroke-linecap="round"
        stroke-linejoin="round"></path>
</svg>

Removing the redundant stroke-width attribute solves the issue on Figma:

<?xml version="1.0" encoding="UTF-8"?>
<svg width="18px" height="18px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"
    color="#000000" stroke-width="2">
    <rect x="9" y="2" width="6" height="12" rx="3" fill="#000000" stroke="#000000"
        stroke-width="1.5"></rect>
    <path d="M5 10V11C5 14.866 8.13401 18 12 18V18V18C15.866 18 19 14.866 19 11V10" stroke="#000000"
        stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
    <path d="M12 18V22M12 22H9M12 22H15" stroke="#000000" stroke-width="2" stroke-linecap="round"
        stroke-linejoin="round"></path>
</svg>

In the next few days I'll try to investigate if other icons suffer from the same problem and open a PR :)