CVE-2026-50159: Mermaid Mermaid Allows CSS Injection Applying Vulnerability

MODERATE
Advisory Identifier: GHSA-6x64-9x62-f2gx
CWE-94
Published
Advisory Summary

CVE-2026-50159 is a MODERATE mermaid allows css injection applying vulnerability (CWE-94: Improper Control of Generation of Code ('Code Injection')) affecting Mermaid libraries in the npm ecosystem. The issue involves mermaid allows css injection applying to sibling elements of the diagram. Remediation is available by upgrading affected packages to version 11.16.1, 10.9.8.

CVE-2026-50159 at a Glance

CVE Identifier CVE-2026-50159
GHSA Identifier GHSA-6x64-9x62-f2gx
Severity MODERATE
CVSS v3.1 Base Score N/A
CWE Classification CWE-94: Improper Control of Generation of Code ('Code Injection')
Affected Product Mermaid
Package Ecosystem npm
Published Date
Last Updated

How to Fix CVE-2026-50159

To remediate this vulnerability, upgrade all affected Mermaid dependencies to a patched release. Both direct and transitive dependencies should be checked, as frameworks or security libraries may pull in vulnerable versions transitively.

mermaid fixed: 11.16.1
npm install mermaid@11.16.1
mermaid fixed: 10.9.8
npm install mermaid@10.9.8
Verify Direct and Transitive Dependencies

Run the following command in your project directory to verify that all resolved dependencies use the patched release:

npm ls mermaid

How to Check if You Are Affected

To determine whether your Node.js application is affected by CVE-2026-50159, inspect your project dependencies using npm:

npm ls mermaid

Analyze the terminal output to locate any version of Mermaid in your dependency tree. If any resolved version matches the vulnerable ranges listed in the table below (for example, versions earlier than 11.16.1), your application is affected.

Note: The npm ls mermaid command inspects dependencies declared in your package.json and lockfile; it does not perform automated runtime dynamic scanning.

Technical Details

Vulnerability Mechanism & Technical Analysis

This vulnerability is classified under CWE-94: Improper Control of Generation of Code ('Code Injection'), where the product constructs all or part of a code segment using externally-influenced input from an upstream component, but it does not neutralize or incorrectly neutralizes special elements that could modify the syntax or behavior of the intended code segment. In Mermaid, software state validation or input boundaries are circumvented during processing. Review the official source advisory statement below for specific affected components, classes, and reproduction details.

Source Advisory Statement

### 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](https://github.com/mermaid-js/mermaid/releases/tag/mermaid%4011.16.1). A 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) ### 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"](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`. To test, you can try using a `themeCSS` with `& + * { /* my CSS here */}` and see if it's applied outside of your mermaid `<svg>`. ```mermaid-example --- 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

CVE-2026-50159 Affected Mermaid Versions

2 component(s)
Fixed Versions:
11.16.110.9.8
Product / Package Ecosystem Affected Versions Fixed Version
mermaid
npm
≥ 11.0.0-alpha.1
< 11.16.1
11.16.1
mermaid
npm
< 10.9.8
10.9.8

References

Frequently Asked Questions

What is CVE-2026-50159?
CVE-2026-50159 is a security vulnerability in Mermaid involving Mermaid allows CSS injection applying to sibling elements of the diagram under CWE-94: Improper Control of Generation of Code ('Code Injection').
Which Mermaid versions are affected?
Affected versions include releases prior to 11.16.1, 10.9.8 across affected packages: mermaid.
What version fixes CVE-2026-50159?
Upgrading to 11.16.1, 10.9.8 (or the latest patched release for your respective branch) resolves the vulnerability.
Is mermaid affected?
Yes, mermaid is affected in releases prior to 11.16.1, 10.9.8. Upgrade your dependency to 11.16.1, 10.9.8 or later.
What CWE is associated with CVE-2026-50159?
CVE-2026-50159 is classified under CWE-94: Improper Control of Generation of Code ('Code Injection') (The product constructs all or part of a code segment using externally-influenced input from an upstream component, but it does not neutralize or incorrectly neutralizes special elements that could modify the syntax or behavior of the intended code segment.).
How can I check npm dependencies for CVE-2026-50159?
Run the dependency tree command: 'npm ls mermaid'. This command lists direct and transitive dependencies in your build configuration so you can verify if a vulnerable version is resolved.
Machine-readable OSV JSON OSV v1.5 Schema
Normalized schema output
{
  "schema_version" : "1.4.0",
  "id" : "GHSA-6x64-9x62-f2gx",
  "modified" : "2026-08-06T19:55:31Z",
  "published" : "2026-08-06T19:55:31Z",
  "aliases" : [ "CVE-2026-50159" ],
  "summary" : "Mermaid allows CSS injection applying to sibling elements of the diagram",
  "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 `<svg>`.\n\n**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.\n\n### Details\n\nMermaid 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.\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 `<svg>` 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 `<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. \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 `& + * { /* my CSS here */}` and see if it's applied outside of your mermaid `<svg>`.\n\n```mermaid-example\n---\nconfig:\n  themeCSS: |-\n    & + * { 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",
  "severity" : [ {
    "type" : "CVSS_V4",
    "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"
  } ],
  "affected" : [ {
    "package" : {
      "ecosystem" : "npm",
      "name" : "mermaid"
    },
    "ranges" : [ {
      "type" : "ECOSYSTEM",
      "events" : [ {
        "introduced" : "11.0.0-alpha.1"
      }, {
        "fixed" : "11.16.1"
      } ]
    } ]
  }, {
    "package" : {
      "ecosystem" : "npm",
      "name" : "mermaid"
    },
    "ranges" : [ {
      "type" : "ECOSYSTEM",
      "events" : [ {
        "introduced" : "0"
      }, {
        "fixed" : "10.9.8"
      } ]
    } ]
  } ],
  "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"
  } ],
  "database_specific" : {
    "cwe_ids" : [ "CWE-94" ],
    "severity" : "MODERATE",
    "github_reviewed" : true,
    "github_reviewed_at" : "2026-08-06T19:55:31Z",
    "nvd_published_at" : null
  }
}