Icons

• I don’t have the opportunity to design icons often (not to mention icon sets)
• It’s much more common for me to pick icon sets and make icons for them
• What size icons are made for is essential; in web apps, you’re generally interested in tiny icons
• Pick a style for your icons (outlined, filled, rounded, sharp, hand‑written, […]) and stick to it
• Icons need labels
• If you’re trying to use icons at a considerable size, consider whether you’re realistically looking for illustrations, not icons
• When making icons, avoid fractions of pixels
• Be intentional about the thickness of lines
• The optical size of elements is more important than the size in pixels
• Consider padding in your icons
• Ensure that icons not only look good in your design tool but also when exported to SVG
• Test how your icons behave when enlarged in a web browser
• SVG files are worth optimizing
• One icon should consistently mean one thing throughout your interface
• Think twice before adding icons to a section of the interface: Remember that when you add another element, you’ll not only have to name it but also assign an icon to it

May 27, 2025