Windows 10 released the icon font recently. It’s called Segoe UI Symbol and is recommended to the developers of the Windows apps. We can’t recommend it though, because icons have different visual weights, adding visual noise to your apps.
In this article we’ll explain the following:
That’s the how big, dense, and heavy an icons is perceived. Although it can’t be evaluated precisely, the human eye evaluates it instantly. Below is our evaluation of the visual weight of some of the icons from Segoe UI Symbol.
Visual weight is proportional to the space filled by the icon. Large, densely filled icons are perceived to be heavier.
Squint your eyes, and you’ll see the icons as blurred spots. It’s good to make sure they’re nearly identical. Here’s the squint test of the Microsoft’s icons, where that’s clearly not the case:
Here are some general tips for resizing icons according to their shapes:
We like how Jon Hicks explains it in his Icon Handbook:
Therefore, for balancing the visual weights of the icons:
We crafted the Windows 10 icon pack which follows the style of the original SegoeUI Symbol. Needless to say, the visual weight of the icons are far more consistent than Microsoft’s attempt:
Dear Microsoft, please take better care of your square icons. Maybe a style guide could help? Not to brag, but a lot of developers are taking advantage of our icon packs. As for the developers out there, keep using our icons instead of the original ones. Your apps will thank us.
Discover top Figma plugins to streamline your workflow, enhance visuals, and add creative flair to…
Learn how to manage visuals in blog posts to optimize them for SEO in this…
Unraveling Figma’s pricing structure: tips to avoid hefty bills and save money. (more…)
Don't switch tabs to browse icons, illustrations, and photos for your websites. Get them inside…
Transform your Notion space with custom covers! Dive in for easy steps, pro tips, and…
Each design has its own scale. It applies to elements size and like thickness. Now,…
This website uses cookies.