W3C Standards for Linking a Favicon

The short answer

Favicons are declared with a link element in the document head whose rel attribute contains the keyword "icon". That element is defined in the HTML standard, not in a separate favicon specification. HTML is now maintained as a living standard by the WHATWG, and the W3C endorses that work rather than publishing its own competing version. So when people search for the "W3C favicon standard," the rules they actually need are the icon link type in HTML, plus the icons member of the W3C Web Application Manifest for installable sites.

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="manifest" href="/manifest.webmanifest">

This is a common, standards-conformant pattern rather than a mandated one. The specification defines how icon links work; it does not require any particular file format, file name or number of sizes.

What the HTML standard actually defines

• rel="icon": the keyword that marks a resource as an icon for the page. A document may contain several icon links, and the browser chooses the one it considers most appropriate.
• rel="shortcut icon": permitted for historical reasons only. If the word "shortcut" is used, the entire attribute value must be exactly "shortcut icon" (case-insensitive). It adds no functionality over "icon" alone.
• sizes: an optional, space-separated list of dimensions written as width x height, such as "16x16 32x32", or the keyword "any" for scalable formats.
• type: an optional MIME type hint, such as "image/svg+xml" or "image/png", which lets a browser skip icons in formats it cannot use without downloading them.
• href: the location of the icon file. Relative paths are resolved against the document's base URL.

The standard also describes a fallback. When an HTTP or HTTPS page declares no icon link, a browser may request a file named favicon.ico from the site root. This is permitted behavior, not a guarantee, so an explicit link is the dependable approach. Keeping a favicon.ico at the root remains useful for tools and older clients that check only that location.

What the standards do not cover

Several icon conventions that circulate alongside favicon advice are vendor-specific rather than W3C or WHATWG standards. The apple-touch-icon link and the mask-icon link for pinned tabs are Apple conventions. The browserconfig file and tile meta tags come from Microsoft. Browsers may honor them, but their behavior is set by the vendor, not by the HTML specification.

The specification also does not say which formats a given browser must support. Support for SVG favicons in particular has varied between browsers and versions. No compatibility data was supplied for this article, so check current browser compatibility tables before relying on an SVG-only setup. Pairing an SVG with an ICO or PNG fallback avoids the question entirely.

Manifest icons for installable sites

The W3C Web Application Manifest is a JSON file linked with rel="manifest". Its icons member lists image resources, each with src, sizes and type, plus an optional purpose value. The defined purposes are "any", "maskable" (artwork designed to survive cropping into platform-defined shapes) and "monochrome" (a single-color silhouette the platform can tint). These icons are used for home-screen and app-launcher contexts, not for the browser tab, so they complement the HTML icon link rather than replacing it.

{
  "icons": [
    { "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" },
    { "src": "/icon-maskable.png", "sizes": "512x512", "type": "image/png", "purpose": "maskable" }
  ]
}

Where vector logo artwork fits

The linking rules and the artwork are separate concerns, but the format choice affects what sizes and type you declare. Only genuinely scalable files should use sizes="any".

Format | Nature | Typical declaration

SVG | Can contain true vector paths, but may also wrap an embedded bitmap | type="image/svg+xml", sizes="any" only when the content is actually vector

ICO | Raster container that can hold several bitmap sizes | sizes listing the contained dimensions, or "any" in the common fallback pattern

PNG | Raster at a single fixed resolution | sizes matching its exact pixel dimensions

A file ending in .svg is not proof of editable vector artwork. Open it in a vector editor or inspect the markup. Path, shape and text elements are true vectors. A single image element pointing at embedded PNG or JPEG data is effectively a raster image in an SVG wrapper. Such a file will blur when scaled and should not be declared as "any" on the strength of its extension alone.

Choosing a symbol that survives tab sizes

Because the browser may display the icon at very small sizes, a full logo lockup with wordmark and tagline rarely reads well. The more practical choice is usually the brand's simplest mark: a monogram, an isolated symbol, or a single distinctive shape with strong contrast. Building that mark as clean vector artwork lets you export crisp raster sizes for ICO and PNG, serve the same source as an SVG favicon, and derive a padded maskable variant for the manifest. This is a design judgment, not a requirement of the standard.

If the mark belongs to another organization, having a downloadable logo file does not grant permission to crop, simplify or recolor it into a favicon. Rights to the artwork, any fonts in it and the trademark are separate questions from access to the file.

Gaps in the available evidence

No subject-specific evidence was supplied for this article: no browser support figures, no measured display sizes, and no version-specific behavior. The points above rely on the general content of the HTML standard and the Web Application Manifest specification. Confirm current browser behavior and specification wording against the latest published texts before treating any detail as definitive. Markup validators can check that icon links are well formed, but they do not test whether a given browser actually displays the icon.