GHSA-6X64-9X62-F2GX

Vulnerability from github – Published: 2026-08-06 19:55 – Updated: 2026-08-06 19:55
VLAI
Summary
Mermaid allows CSS injection applying to sibling elements of the diagram
Details

Summary

Mermaid does not fully restrict CSS to the rendered SVG subtree. Although selectors are prefixed with #mermaid-X, sibling (~ and +) combinators can still escape the Mermaid container and inject styles to DOM elements adjacent to the diagram <svg>.

Most users of mermaid would not be affected by this, as mermaid adds its <svg> as an only child of it's parent element. However, you may be affected if you manually insert the <svg> (or other elements) into the DOM yourself.

Details

Mermaid namespaces CSS through with a middleware intended to scope all rules to the diagram's SVG element. CSS nesting expands & ~ * { ... } to #svgId ~ *, which selects all sibling elements following the SVG in the DOM, outside the diagram boundary.

Impact

An attacker able to supply diagram source to a page (e.g., user-generated content rendered by Mermaid) could inject CSS rules affecting sibling elements to the diagram <svg> on the host page. This can be used for UI redressing, hiding content, conditional CSS-based probing, or phishing-style visual manipulation.

JavaScript execution is not possible via this vector.

Patches

This has been patched in https://github.com/mermaid-js/mermaid/commit/12d472c9ed43f94814b110da8d7a9ae6dd5266ed and released in Mermaid v11.16.1.

A backport has been made for the v10 branch in 7e83f1533318b307764d961906a73377266f4c5e and was released in Mermaid v10.9.8

Workarounds

If you are inserting the <svg> into the DOM yourself, you can wrap it in an element with no other children, e.g. <div><svg>...</svg></div> or element.innerHTML = svg. Alternatively, you can use mermaid.run() or mermaid.initialize() which will do this for you.

Setting "securityLevel": "sandbox" will also prevent this, or setting the secure config value in the mermaid config to avoid allowing diagrams to modify fontFamily, themeCSS, altFontFamily, and themeVariables.

To test, you can try using a themeCSS with & + * { /* my CSS here */} and see if it's applied outside of your mermaid <svg>.

---
config:
  themeCSS: |-
    & + * { background:red !important; width:100vw !important; height:100vh !important; position:fixed !important; inset:0 !important; }
---
info

References

  • GHSA-87f9-hvmw-gh4p/CVE-2026-41159 (related vulnerability)
  • https://github.com/mermaid-js/mermaid/commit/12d472c9ed43f94814b110da8d7a9ae6dd5266ed
  • https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.16.1
  • https://github.com/mermaid-js/mermaid/commit/7e83f1533318b307764d961906a73377266f4c5e
  • https://github.com/mermaid-js/mermaid/releases/tag/v10.9.8
Show details on source website

{
  "affected": [
    {
      "package": {
        "ecosystem": "npm",
        "name": "mermaid"
      },
      "ranges": [
        {
          "events": [
            {
              "introduced": "11.0.0-alpha.1"
            },
            {
              "fixed": "11.16.1"
            }
          ],
          "type": "ECOSYSTEM"
        }
      ]
    },
    {
      "package": {
        "ecosystem": "npm",
        "name": "mermaid"
      },
      "ranges": [
        {
          "events": [
            {
              "introduced": "0"
            },
            {
              "fixed": "10.9.8"
            }
          ],
          "type": "ECOSYSTEM"
        }
      ]
    }
  ],
  "aliases": [
    "CVE-2026-50159"
  ],
  "database_specific": {
    "cwe_ids": [
      "CWE-94"
    ],
    "github_reviewed": true,
    "github_reviewed_at": "2026-08-06T19:55:31Z",
    "nvd_published_at": null,
    "severity": "MODERATE"
  },
  "details": "### Summary\n\nMermaid does not fully restrict CSS to the rendered SVG subtree. Although selectors are prefixed with `#mermaid-X`, sibling (`~` and `+`) combinators can still escape the Mermaid container and inject styles to DOM elements adjacent to the diagram `\u003csvg\u003e`.\n\n**Most users of mermaid would not be affected by this**, as mermaid adds its `\u003csvg\u003e` as an only child of it\u0027s parent element. However, you may be affected if you manually insert the `\u003csvg\u003e` (or other elements) into the DOM yourself.\n\n### Details\n\nMermaid namespaces CSS through with a middleware intended to scope all rules to the diagram\u0027s SVG element. CSS nesting expands `\u0026 ~ * { ... }` to `#svgId ~ *`, which selects all sibling elements following the SVG in the DOM, outside the diagram boundary.\n\n### Impact\n\nAn attacker able to supply diagram source to a page (e.g., user-generated content rendered by Mermaid) could inject CSS rules affecting sibling elements to the diagram `\u003csvg\u003e` on the host page. This can be used for UI redressing, hiding content, conditional CSS-based probing, or phishing-style visual manipulation.\n\nJavaScript execution is not possible via this vector.\n\n### Patches\n\nThis has been patched in https://github.com/mermaid-js/mermaid/commit/12d472c9ed43f94814b110da8d7a9ae6dd5266ed and released in [Mermaid v11.16.1](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.16.1).\n\nA backport has been made for the v10 branch in 7e83f1533318b307764d961906a73377266f4c5e and was released in [Mermaid v10.9.8](https://github.com/mermaid-js/mermaid/releases/tag/v10.9.8)\n\n### Workarounds\n\nIf you are inserting the `\u003csvg\u003e` into the DOM yourself, you can wrap it in an element with no other children, e.g. `\u003cdiv\u003e\u003csvg\u003e...\u003c/svg\u003e\u003c/div\u003e` or `element.innerHTML = svg`. Alternatively, you can use `mermaid.run()` or `mermaid.initialize()`  which will do this for you. \n\nSetting [\"securityLevel\": \"sandbox\"](https://mermaid.js.org/config/schema-docs/config.html#securitylevel) will also prevent this, or setting the [`secure`](https://mermaid.js.org/config/schema-docs/config.html#secure) config value in the mermaid config to avoid allowing diagrams to modify `fontFamily`, `themeCSS`, `altFontFamily`, and `themeVariables`.\n\nTo test, you can try using a `themeCSS` with `\u0026 + * { /* my CSS here */}` and see if it\u0027s applied outside of your mermaid `\u003csvg\u003e`.\n\n```mermaid-example\n---\nconfig:\n  themeCSS: |-\n    \u0026 + * { background:red !important; width:100vw !important; height:100vh !important; position:fixed !important; inset:0 !important; }\n---\ninfo\n```\n\n### References\n\n- GHSA-87f9-hvmw-gh4p/CVE-2026-41159 (related vulnerability)\n- https://github.com/mermaid-js/mermaid/commit/12d472c9ed43f94814b110da8d7a9ae6dd5266ed\n- https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.16.1\n- https://github.com/mermaid-js/mermaid/commit/7e83f1533318b307764d961906a73377266f4c5e\n- https://github.com/mermaid-js/mermaid/releases/tag/v10.9.8",
  "id": "GHSA-6x64-9x62-f2gx",
  "modified": "2026-08-06T19:55:31Z",
  "published": "2026-08-06T19:55:31Z",
  "references": [
    {
      "type": "WEB",
      "url": "https://github.com/mermaid-js/mermaid/security/advisories/GHSA-6x64-9x62-f2gx"
    },
    {
      "type": "WEB",
      "url": "https://github.com/mermaid-js/mermaid/pull/8022"
    },
    {
      "type": "WEB",
      "url": "https://github.com/mermaid-js/mermaid/commit/12d472c9ed43f94814b110da8d7a9ae6dd5266ed"
    },
    {
      "type": "WEB",
      "url": "https://github.com/mermaid-js/mermaid/commit/7e83f1533318b307764d961906a73377266f4c5e"
    },
    {
      "type": "PACKAGE",
      "url": "https://github.com/mermaid-js/mermaid"
    },
    {
      "type": "WEB",
      "url": "https://github.com/mermaid-js/mermaid/releases/tag/mermaid@11.16.1"
    },
    {
      "type": "WEB",
      "url": "https://github.com/mermaid-js/mermaid/releases/tag/v10.9.8"
    }
  ],
  "schema_version": "1.4.0",
  "severity": [
    {
      "score": "CVSS:4.0/AV:N/AC:L/AT:N/PR:N/UI:P/VC:N/VI:L/VA:N/SC:L/SI:L/SA:L",
      "type": "CVSS_V4"
    }
  ],
  "summary": "Mermaid allows CSS injection applying to sibling elements of the diagram"
}



Log in or create an account to share your comment.




Tags
Taxonomy of the tags.


Loading…

Loading…

Loading…

Drag nodes to arrange them. Double-click a related vulnerability to open it, or a source to visit its link. The Physics button on the left tunes the layout and the simulation; the legend at the bottom left hides or shows nodes by kind and by sighting type.

Forecast uses a logistic model when the trend is rising, or an exponential decay model when the trend is falling. Fitted via linearized least squares.

Sightings

Author Source Type Date Other

Nomenclature

  • Seen: The vulnerability was mentioned, discussed, or observed by the user.
  • Confirmed: The vulnerability has been validated from an analyst's perspective.
  • Published Proof of Concept: A public proof of concept is available for this vulnerability.
  • Exploited: The vulnerability was observed as exploited by the user who reported the sighting.
  • Patched: The vulnerability was observed as successfully patched by the user who reported the sighting.
  • Not exploited: The vulnerability was not observed as exploited by the user who reported the sighting.
  • Not confirmed: The user expressed doubt about the validity of the vulnerability.
  • Not patched: The vulnerability was not observed as successfully patched by the user who reported the sighting.
Vulnerability timeline

Sightings and recorded dates, grouped by day · UTC

JSON
How durations are calculated

Following the VTEM framework (Black Hat USA 2015), time to patch starts when the vendor or a coordinator was informed, total time to patch at discovery, and disclosure to patch at public disclosure; vendor response time runs from the report to its acknowledgement. Time to exploit and time unpatched start at the earliest discovery or report, falling back to public disclosure. Unpatched time ends at the first recorded patch, or the calculation time when no patch is recorded. Exploitation to patch shows the interval between those two events; a published proof of concept is a public exploit, not exploitation.

Each result shows its source dates. A negative interval means the end event came first; when date-only inputs leave the order open, the result says so. Date-only inputs are approximate. The earliest evidence wins: KEV report dates and sightings are labelled as such. Records describing another vulnerability are listed but never calculated from, and a PoC alone does not establish exploitation. Missing patch evidence does not prove that no patch exists. Filters below change the event list only.

Events included in the timeline

Loading timeline…


    Loading…

    Loading…

    Loading…

    Related by attack behaviour

    Vulnerabilities whose description is nearest to this one in the vector space of the CIRCL/vulnerability-attack-technique-biencoder model. This is a similarity search over the bi-encoder space (plain cosine), not a classification, and it has no measured accuracy.