Hi, I am Jafar Rezaei (sayjeyhi). In this blog post, I want to talk briefly about icons. This is an issue that we often deal with in frontend development, or designing interfaces, or even sometimes backend developers work with. And at the end, I will introduce you to a cool and simple way to manage them. https://www.freepik.com/premium-photo/flat-lay-human-hands-choosing-beautiful-skeins-purple-green-tones-with-blank-label-mock-up-wooden-table_8022757.htmIf you are creating an interface (it doesn't even matter which platform), you need icons in every project you work with or have worked with. This need and concern are not specific to the present time and have been around for a long time. From finding the right icon to using it in the project has always been a story. Many projects have helped us solve these problems, but each had its own set of challenges. Let's start by examining what an icon is. The definition on Wikipedia states: In computing, an icon is a pictogram or ideogram displayed on a computer screen in order to help the user navigate a computer system. Of course, concepts such as symbol, index, etc., were sometimes used to express the same theme (almost), but the common word is the same as an icon.

Modern man has certainly somehow adapted himself to the icon and met his needs. Since urbanization had just begun. People used photos to put icons and many other things. I meant a photo, a saw, for example, the same IMG or CSS background tag in web pages. Of course, it was tough work and nerve-wracking. We may need to do this in current projects as well. But here, we try to examine the general issues that are needed in most projects. An overview shows that the most common methods used by humans to display icons were:

• Use single images of icons: Not applicable due to the need for a separate request to load each image
• Using the sprite collection of اimages‌: the hassle of replacing and producing a sprite image and not being a vector
• Use of icon fonts: Restrictions on icon selection, the hassle of generating icon fonts, and having to load the font file to load all the icons together
• Using custom icon fonts: The same as the above minus the restrictions on icon selection
• Use SVG icons: Manage SVG assets and optimize SVG code Maybe using CSS to create icons: the difficulty of producing icons and more for logos and single icons. Nooowww, man has come to a free site that has collected almost every popular icon package on the market and tried to solve the problems that existed in the above cases and with each of the methods of using the icon, and besides for both graphic artists and Create pre-made plugins and packages that allow you to quickly and easily use different icons from different packages. This method has been tested on various Iranian and foreign projects, and today the second version of its site has been launched.

The result of this human effort is the production of a site called Iconbox, which is available for the free and open-source :) The desktop and mobile versions are also optimized with an attractive user interface for use on PC, phone, PWA, and in-app in software such as Figma and Adobe xd, and we will add support for these applications soon. Home and search mobile pagesFavorites and settings mobile pagesiconbox.space app.iconbox.space

Help today's humanity by republishing this article and supporting us.

our Github: https://github.com/iconsbox