Favicons
Articles about favicons.
290 posts
How to Show a Loading Indicator in a Favicon
Show a loading state in your favicon by swapping vector icon files with JavaScript. Covers artwork preparation, SVG frames, fallbacks and testing.
Favicon Examples on W3Schools: How the Link Tag Works and How to Prepare the Icon
How the favicon examples taught in W3Schools-style HTML tutorials work, how ICO, PNG and SVG differ, and how to adapt a vector logo for favicon use.
What is a custom favicon
A custom favicon is a small site icon designed for a specific brand instead of a default. Learn what the term means in vector logo design and how SVG, raster and file containers relate to it.
Add a favicon in ASP.NET
How to add a favicon to an ASP.NET or ASP.NET Core site: where the file goes, which link tags to use, how SVG favicons fit in, and what to check in your logo artwork first.
Find an eye favicon design
How to find or prepare an eye favicon in SVG: what makes an eye icon readable at tab size, how to confirm a file is true vector artwork, and what licensing to check.
White SVG Favicon: How to Set and Control Its Color
Why a white SVG favicon can vanish on light browser tabs, and how to control its color with fill values, a prefers-color-scheme rule and a raster fallback.
Create a favicon with Logaster
How to build a favicon from a Logaster logo, prepare light and dark variants, check vector versus raster output, and confirm usage rights before launch.
How to Make a Favicon Look Bigger by Adjusting Padding
Make a favicon look bigger by trimming the empty space around the mark, fitting it to a square canvas, and simplifying details so it reads clearly at tab size.
Favicon dark and light mode
How to make a favicon that works in both dark and light mode: an SVG favicon with a color-scheme media query, static fallbacks, and how to prepare the vector artwork.
Setting Up a Favicon in Squarespace
How a Squarespace favicon works, why the upload is a small raster image, and how to prepare a vector logo so it stays legible on a tiny pixel grid.
How to Make a Favicon with a Transparent Background
Make a favicon transparent: remove the background from your vector logo, export to a format with an alpha channel, and check it on light and dark browser tabs.
Light Favicon Design: Building the Dark-Mode Variant of a Vector Icon
What a light favicon is, why it is needed for dark browser themes, and how to build and deliver it from vector logo artwork.