SVG Favicon

Download

Quickly and simply add an svg favicon to your site!

Upload SVG Favicon

Description

Safely add an SVG favicon to your site! Don’t limit your site favicon to just the .ico format. Upload cool vector art from your favorite vector app in just seconds.

Usage

SVG Favicon Tab

After installation, navigate to Appearance > SVG Favicon.

Safari Pinned Tab Icon

Features

  • The safe and secure upload of SVG favicons
  • Upload in seconds
  • Generates site manifest
  • Supported in most modern browsers

Tabs

SVG Favicon

Upload field: Upload your SVG favicon in the upload field. Only SVGs are accepted. 

Manifest: A manifest is generated each time an SVG favicon is uploaded. If you already have a site manifest, uncheck “Use this manifest”. 

Notes SVG favicons with rel=”icon” will not show up in Safari and will default to the favicon set in the customizer. Please click the Safari Tab to add a mask-icon

Safari

Upload Field: Here you will upload an SVG “mask icon”. 

What is a mask icon? A mask icon is a specialized SVG icon for its “Pinned Tab Icons”. Mask icons should be 100% black with a transparent background.

  • Important: The SVG file must be a single layer and the viewBox attribute must be set to “0 0 16 16”.
  • Notes: Pinned tab icons will overide the standard svg favicon in Safari.
  • Caching: Programatic cache busting of mask icons in Safari currently does not work. Quit and restart after deleting browser cache to see changes take effect.

Credits

Megaman icon made from Icon Fonts is licensed by CC BY 3.0

SVG Sanitizer

Download & Support

Do you like this plugin?