Favicons
Articles about favicons.
290 posts
Add or change a favicon in Squarespace
How to add or replace a favicon in Squarespace, and how to prepare a small, legible icon from your vector logo before uploading it.
UL Logo Design for Favicons: Building a Monogram That Holds Up at Small Sizes
What a UL monogram favicon is, how it differs from a full UL logo, how to choose the symbol, and how to prepare vector source files for favicon use.
How to Add a Favicon in HTML
Add a favicon in HTML with a few link tags in the page head, and prepare vector logo artwork so the icon stays legible at very small sizes.
Create a Complete Favicon Set from Your Vector Logo
How to turn a vector logo into a complete favicon set: which files to produce, how to prepare the artwork, export settings, HTML references and final checks.
PNG Pixel Editors for Favicons: What They Do and When You Need One
What a PNG pixel editor is, how it differs from a vector logo editor, and how it helps refine favicon artwork on a pixel grid at very small sizes.
Favicon for a Team Website: Choosing the Right Symbol
How to pick and prepare a team favicon: which symbol from the team logo to use, how to simplify vector artwork for tiny sizes, and what rights to check.
Choose favicon formats and sizes
Compare ICO, PNG and SVG favicons, learn which sizes browsers and devices request, and prepare vector logo artwork that stays legible at very small scales.
Convert Logo into Favicon
How to turn a vector logo into a favicon: simplify the mark, prepare clean paths, plan light and dark variants, export the file set and check the result.
Set or Replace a Website Favicon in HTML
How to set or replace a favicon with HTML link elements, why CSS can't do it, how to prepare an SVG favicon from a vector logo, and how to get browsers to show the new icon.
How to Crop an Image for a Favicon
Crop logo artwork for a favicon: pick one recognizable symbol, fit it to a square artboard with even padding, crop in vector, then test it at small sizes.
How to Add a Favicon in Angular
Add a favicon.ico to an Angular app: prepare the icon from vector logo artwork, place it in the right folder, register it in angular.json, link it and verify it.
Favicon vs. Submark: Which Logo Version to Use
A submark is a compact logo variant, while a favicon is a small browser icon. Learn when a submark can become a favicon and when it needs a simplified version.