Mermaid erDiagram styling help

First, search the help docs and this forum. Maybe your question has been answered! The debugging steps can help, too. Still stuck? Delete this line and proceed.

What I’m trying to do

Hello.
Trying to make erDiagramm and need some coloring for focusing on some blocks. Search for solutions but without success. I want to implement some css inside certain mermaid for give color to block by it’s name. Can anybody show correct code that works in that moment with some css styles embedded in certain mermaid block.

PS: Styling via external css works, but its not applicable for my work.

Things I have tried

Closest successor code here. But only theme application here is work as intended:

%%{init: {
“theme”: “dark”,
“themeCSS”: [
“.er.relationshipLabel { fill: red; }”,> “.er.relationshipLabelBox { fill: purple; }”,
“.er.entityBox { fill: red !Important; }”,
“[id*=entity-ANYLAYOUT] .er.entityBox { fill: orange;}”,
“[id=entity-ANYLAYOUT] .er.entityBox { fill: orange;}”
]
}}%%

Question closed with help coming form official Discord.
The flow:

  • Create custom CSS classes (in snippets) specifically for every complex diagram
  • Attach this classes to solo md-file with solo diagram via cssclasses page-file property
  • Also attach same properties in files where diagram inserted if needed
1 Like

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.