Yet, remember that you can apply only one color to such icons. Indeed, it’s possible to change the font color and add a shadow to it, if necessary. Reasons to Avoid Using Icon Fontsįirst, we mentioned the icon fonts scalability. While icon fonts have several considerable advantages, we should not disregard their disadvantages. Third, icon fonts are small in size, and thus they can load quite fast. Browsers request the indicated file and show the icon. Second, the possibility to point to the font file lets designers use any font they wish without worrying if it is web-safe. You only have to create relevant classes in your CSS. Mainly, you can adjust icons with the help of CSS, modifying their size, color, and shape. Why Have Icon Fonts Been Popular?įirst, each character in icon fonts is scalable. Icon fonts were the de facto method of adding vector-based icons to websites until early 2020 when the real SVG support in different browsers became stable. As a rule, a set of icon fonts is stored in a font file. Icon fonts, as the name suggests, represent fonts that contain icons instead of letters and numbers. Now, we’ll explore what icon fonts and SVG icons are, how you can use them, and which method you should prefer in particular situations. As an integral part of UI design, icons can also represent a challenge for developers.Īn intense debate about icon fonts vs SVG fonts has been taking place for a while. You are sure to find them in navigation menus, contact details, product descriptions, etc. It’s hard to imagine modern web pages without these tiny but helpful elements – icons.
0 Comments
Leave a Reply. |