UW Favicons

In the past, a website or web application included a single favicon file that would be used as a branding and visual identification tool in a browser’s tabs or bookmark lists. 

Now, modern browsers and operating systems have varying ways of specifying an icon that visually represents a website or app that has been opened or saved in a browser, added to a mobile device’s home screen, or saved to a Windows laptop tile, among other possibilities.

Note: The standard UW–Madison favicon — a white “W” on a red background — is included by default with UW Theme 2.0. No additional setup is needed for sites using the theme. The favicon files available here are for other approved uses.

This zip file contains the sample markup and files you need to use the official UW crest logo as your non-UW Theme 2.0 site's favicon in all of these different contexts. The files were generated using https://realfavicongenerator.net and follow common best practices.

To use the favicons, save the *images* folder and the *browserconfig.xml*, *favicon.ico*, and *site.webmanifest* files in your site’s code. Copy the markup between the *BEGIN FAVICONS* and *END FAVICONS* comments in the *example.html* file into your project's HTML files or templates. If you save the various files or images directory in different locations, you'll need to edit the markup and paths within *browserconfig.xml* and *site.webmanfiest* accordingly.