Build Design Systems With Penpot Components
Penpot's new component system for building scalable design systems, emphasizing designer-developer collaboration.

Design + Sketch App — Medium | Valentina Berois
In the last 10 years, we’ve started seeing icon packages for free download anywhere we looked around the internet. As this may be really great for inspiration, or for small start-ups or non-profit projects, it has become more than a dangerous temptation for designers working on retail or agencies environments.
If you are working on a school project, you probably have nothing to fear when it comes to permissions of usage or copyrights, but little by little, going from a stand-alone freelancer to an international growing digital agency, licences and usage permissions get more and more tricky, so much, that it’s always safer to just use only what’s owned or self-produced.
If you have visual designers with time in their hands to produce actual icon packs from scratch, you are probably a huge or really small company being able to afford this. But what happens to every Design Team environment that falls right in the middle?
From my experience working at a Digital Agency, among an Agile UX methodology environment, with a role focused not only in user experience but also user interface design, I’ve come to face the harsh reality of not having the time in my hands to produce barely any icon or graphic asset in a creative manner.
Producing icons is TOO time consuming for MVP projects
As my focus is now on the concept and design of digital products, I can not afford to spend hours producing icons, simply because this is never taken in count at the time of estimating time and materials for a project, specially not for minimum viable products.
In the best case, if the client is a big powerful corporation, with a strong and solid defined CI, you will have no problem at all, because the icons will come to you.
But what happens when this is not the case, and you have no time/budget to produce them, but it’s of course expected that you include these elements in your designs?
One thing is for sure, you need to get it from somewhere, and if you don’t want to spend millions in the future, you need to be really objective and mostly generic to select and acquire them.
For a start, there are some open source icon sets that are familiar for every user, and my favourite example is the Material Design Icons pack. Among these icons you will see that most of them are available in different styles, so you will find a bold and a light or line version for almost each one of them. This way you will be able to choose the style that fits better to your designs.
Icons from http://www.streamlineicons.com/ux/
Now let’s suppose that you bought an icon set or downloaded an open source one. Probably what’s now a bunch of SVG’s that you need to somehow layout together, browse, select and pull every-time you need one. This tool will work this problem our for you, making it easy to integrate icons into your projects with little effort and maintain solid pixel perfect designs.
Here is all you need: Icon packs (recommendations available from article’s resources) and the magnificent tool: IconJar Download (you have a 30 days trial, and believe me, you should give it a go after that, it’s worth it!)
There is what I would call a solid alternative to IconJar, but you need to be a Sketch App user for this…
Sketch libraries allow us now to create our own icon sets with symbols to pull from different files later on.
These are of course my favourite tips and workflows when it comes to icons handling. You can find some more interesting tools that might deserve to be tried out among this article’s resources shared below.
If you have further tools or tips in mind to manage icons in a solid manner please leave your comments and tips below! ⬇⬇⬇
Gif animation by @FOXADHD
Icon Packages recommendations:
Icon Package with Browser tool included:
Tools to manage your icons:
Pattern Generator online tool:
Seamless Background Pattern Generator & Maker v1.0
Largest online icons database:
Flaticon, the largest database of free vector icons
Sketch Plug-in for alternative Icon Library:
Icons handling – tools & tips ✔ was originally published in Design + Sketch on Medium, where people are continuing the conversation by highlighting and responding to this story.
AI-driven updates, curated by humans and hand-edited for the Prototypr community