Mermaid Diagrams Are Hard To Read / Poor Contrast

[P_S1 (P S)]

Where does the bug appear (feature/product)?

Cursor IDE

Describe the Bug

I was embarrassed today because I was doing a presentation to the company to try and adopt cursor across our 80 software engineers. At one point, I was demonstrating how cool all the diagrams are, or so I thought, hence this report.

Mermaid Diagrams have really poor contrast and styling, you can’t even read the words. This is particularly bad in any dark theme with many types of mermaid diagrams:
Can’t see flow chart arrows, gitgraph, kanban boards, mindmaps, etc. Pie Charts are just all black. Charts are light gray on white.

Mermaid

Ideally, some of the charts would even have some color like on the mermaid diagram website they have examples of how the Git graph chart has some nice colors so that you can visualize easier. Such as the git graph, LR Chart, XY Chart, have some nice colour.

I’m guessing the main one that was optimized was flowchart since it’s okay, but some contrast issues depending on theme.

Out of all the built in themes, in “Light High Contrast” most diagrams are actually quite readable (fixes all the white on light gray, black on dark grey text, etc.).

Some of the diagrams get less readable when you open them in full screen and some get more readable.

Screenshot is with the default Dark Modern theme, but it’s similar across most built-in themes.

Steps to Reproduce

Ask cursor to show a mermaid diagram back to you.

Expected Behavior

Being able to read the text, and visually make out the lines.

Screenshots / Screen Recordings

Operating System

Windows 10/11

Version Information

Version: 2.6.12 (user setup)
VSCode Version: 1.105.1
Commit: 1917e900a0c4b0111dc7975777cfff60853059d0
Date: 2026-03-04T21:41:18.914Z
Build Type: Stable
Release Track: Default
Electron: 39.6.0
Chromium: 142.0.7444.265
Node.js: 22.22.0
V8: 14.2.231.22-electron.0
OS: Windows_NT x64 10.0.26200

For AI issues: which model did you use?

GPT-5.4

Does this stop you from using Cursor

No - Cursor works, but with this issue

[P_S1 (P S)]

@deanrie hope that’s okay to tag you

[deanrie]

Hey, thanks for the detailed report and the screenshot, super helpful.

This is a known issue with Mermaid diagram theming in dark themes. The team is aware, and your report helps us prioritize it, especially the breakdown of which diagram types are affected like pie charts turning fully black and gitgraph arrows becoming invisible.

Your note about “Light High Contrast” is a helpful data point too.

I don’t have a workaround right now other than switching themes for presentations, unfortunately. I’ll make sure this gets more visibility given the context. Rolling out Cursor to 80 engineers and having diagrams be unreadable during a demo is definitely not ideal.

I’ll update here if there’s any news.