Draw Mermaid Diagrams

Instructions

When the user asks to create a diagram or visualize a process, use Mermaid syntax within Markdown code blocks.

Identify the Diagram Type: Determine the best diagram type for the user's request (e.g., Flowchart for processes, Sequence Diagram for interactions, ER Diagram for data structures).
Consult the Specification: Refer to SPEC.md for syntax details if needed.
Generate Markdown: Output the diagram inside a mermaid code block.
Validate (Optional): For complex diagrams, use the validation script to check for syntax errors.

Validation

To validate a mermaid diagram file (or a markdown file containing mermaid blocks), use the validation script. It uses the official Mermaid CLI to check for syntax errors.

Draw Mermaid Diagrams

Instructions

When the user asks to create a diagram or visualize a process, use Mermaid syntax within Markdown code blocks.

Identify the Diagram Type: Determine the best diagram type for the user's request (e.g., Flowchart for processes, Sequence Diagram for interactions, ER Diagram for data structures).
Consult the Specification: Refer to SPEC.md for syntax details if needed.
Generate Markdown: Output the diagram inside a mermaid code block.
Validate (Optional): For complex diagrams, use the validation script to check for syntax errors.

Validation

To validate a mermaid diagram file (or a markdown file containing mermaid blocks), use the validation script. It uses the official Mermaid CLI to check for syntax errors.

Flow Skill Draw Mermaid Diagrams

Draw Mermaid Diagrams

Instructions

Validation

Flow Skill Draw Mermaid Diagrams

Draw Mermaid Diagrams

Instructions

Validation

Diagram Types Selection

Examples

Flowchart Example

Sequence Diagram Example

Resources

Songwriting And Ai Music

Image Generation

Sprites And Images

Graphics And Shapes

Theme Factory

Evolution