# Mermaid Diagrams Are Hard To Read / Poor Contrast **URL:** \ **Category:** Bug Reports\ **Tags:** themes, chat\ **Created:** [March 6, 2026, 12:02pm UTC](https://forum.cursor.com/t/mermaid-diagrams-are-hard-to-read-poor-contrast/153850 "2026-03-06T12:02:43Z")\ **Posts on this page:** 5\ **Page:** 1
**Author:** ![P\_S1](https://avatars.discourse-cdn.com/v4/letter/p/c37758/32.png) [@P\_S1](https://forum.cursor.com/u/P_S1)\ **Post date:** [March 6, 2026, 12:02pm UTC](https://forum.cursor.com/t/mermaid-diagrams-are-hard-to-read-poor-contrast/153850/1 "2026-03-06T12:02:43Z")
### 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](https://mermaid.js.org/intro/)** > > Create diagrams and visualizations using text and code. 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 ![Screenshot 2026-03-06 045854.png](https://us1.discourse-cdn.com/cursor1/original/3X/8/f/8f0a584e1ec3dcffb21e6998e68dc647a84755e5.png) ### 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 ---
**Author:** ![P\_S1](https://avatars.discourse-cdn.com/v4/letter/p/c37758/32.png) [@P\_S1](https://forum.cursor.com/u/P_S1)\ **Post date:** [March 6, 2026, 8:32pm UTC](https://forum.cursor.com/t/mermaid-diagrams-are-hard-to-read-poor-contrast/153850/3 "2026-03-06T20:32:09Z")
@deanrie hope that’s okay to tag you ---
**Author:** ![deanrie](https://sea3.discourse-cdn.com/cursor1/user_avatar/forum.cursor.com/deanrie/32/1263_2.png) [@deanrie](https://forum.cursor.com/u/deanrie)\ **Post date:** [March 7, 2026, 9:11am UTC](https://forum.cursor.com/t/mermaid-diagrams-are-hard-to-read-poor-contrast/153850/4 "2026-03-07T09:11:06Z")
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. ---
**Author:** ![system](https://sea3.discourse-cdn.com/cursor1/user_avatar/forum.cursor.com/system/32/99069_2.png) [@system](https://forum.cursor.com/u/system)\ **Post date:** [March 29, 2026, 9:11am UTC](https://forum.cursor.com/t/mermaid-diagrams-are-hard-to-read-poor-contrast/153850/6 "2026-03-29T09:11:28Z")
Closed on March 29, 2026, 9:11am UTC This topic was automatically closed 22 days after the last reply. New replies are no longer allowed. ---
**Author:** ![Colin](https://sea3.discourse-cdn.com/cursor1/user_avatar/forum.cursor.com/colin/32/90452_2.png) [@Colin](https://forum.cursor.com/u/Colin)\ **Post date:** [April 27, 2026, 3:36pm UTC](https://forum.cursor.com/t/mermaid-diagrams-are-hard-to-read-poor-contrast/153850/8 "2026-04-27T15:36:33Z")
Hi @P_S1! This should be fixed now. Please try upgrading to _v3.2_, and raise a new thread if you’re still facing an issue!