icongen - Web and App icons and PNG favicons

Generate Web and App Icons from a single source image locally in your browser. Ideally use an SVG image (needs a set width and height in SVG).
icongen@github.

Icons to generate

Image and target path


Example HTML <head> to use icons

<link rel="icon" type="image/png" href="/iconx/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/iconx/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/iconx/android-192x192.png" sizes="192x192">
<link rel="apple-touch-icon" href="/iconx/apple-touch-icon-180x180.png" sizes="180x180">
<meta name="msapplication-config" content="/iconx/browserconfig.xml">
      

browserconfig.xml for Edge (Windows 10)

<?xml version="1.0" encoding="utf-8" ?>
<browserconfig>
  <msapplication>
    <tile>
    <square70x70logo src="/iconx/tile70x70.png" />
    <square150x150logo src="/iconx/tile150x150.png" />
    <wide310x150logo src="/iconx/tile310x150.png" />
    <square310x310logo src="/iconx/tile310x310.png" />
    <tilecolor>transparent</tilecolor>
    </tile>
  </msapplication>
</browserconfig>
      


Background info how and when to use icons

favicons, touch icons, pinned sites or look at alternatives like realfavicongenerator.net developer.apple.com Touch Icons, Firefox docs etc.

Thanks to MrColes for the .ico generation code.