Executive brief
Mermaid is a popular JavaScript-based diagramming and charting tool. A vulnerability in its configuration handling allows an attacker to inject malicious styling (CSS) into a web page where a diagram is displayed. This can lead to the unauthorized modification of the page's appearance or the potential theft of sensitive information displayed on the same page.
Technical details
A CSS injection vulnerability exists in Mermaid due to improper sanitization of configuration options including 'fontFamily', 'themeCSS', and 'altFontFamily'. An attacker can exploit the 'stylis' library's scope reference handling (using the '&' character) to escape the intended '#mermaid-xxx' CSS scoping. By using selectors like ':not(&)', an attacker can apply arbitrary styles to all elements on the hosting page, enabling page defacement or data exfiltration via CSS ':has()' selectors. The vulnerability is patched in versions 11.15.0 and 10.9.6; workarounds include enabling 'secure' mode or setting 'securityLevel' to 'sandbox'.
Affected products
- mermaid-js mermaid >= 11.0.0-alpha.1, <= 11.14.0; <= 10.9.5
Timeline
- 2026-05-11: disclosed
- 2026-05-11: advisory
- 2026-05-11: patched