Skip to content

Hosted favicons are all media-gated (prefers-color-scheme) with no plain fallback → Safari shows letter tile #6040

@jmfoster

Description

@jmfoster

What's wrong

On our Mintlify-hosted docs (agentconcepts.io), Safari shows the auto-generated letter tile ("A") instead of the favicon. Chrome renders the favicon correctly. Verified in a Safari private window, so it is not a cache issue.

Root cause

Every favicon <link> Mintlify generates carries a media="(prefers-color-scheme: light|dark)" attribute, and there is no plain (non-media) fallback link. From our deployed <head>:

<link rel="icon" href="…/_generated/favicon/favicon-32x32.png" media="(prefers-color-scheme: light)">
<link rel="icon" href="…/_generated/favicon-dark/favicon-32x32.png" media="(prefers-color-scheme: dark)">
<link rel="shortcut icon" href="…/_generated/favicon/favicon.ico" media="(prefers-color-scheme: light)">

All six rel="icon" links (plus the .ico) are media-gated; none is un-gated. Safari supports prefers-color-scheme in CSS but does not honor it on favicon <link> tags — finding no un-gated icon link, it falls back to the generated letter tile.

Repro

  • docs.json: "favicon": "/_assets/favicon.svg" (single-string form).
  • Also tried a .png favicon source — the generated links are still all media-gated, so the gating appears unconditional (not a function of source format).

Requested fix

Emit a default, non-media <link rel="icon"> (and a non-media favicon.ico) alongside the light/dark media-gated variants, so Safari has a usable fallback. This is the standard favicon pattern.

Refs

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions