Mermaid diagram generation for architecture visualization, data flow diagrams, and component relationships. Use for documentation, PR descriptions, and architectural analysis.
Installs into .claude/skills of the current project.
Are you the author of Diagram Generation?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/neversight-diagram-generation)
---
name: diagram-generation
description: "Mermaid diagram generation for architecture visualization, data flow diagrams, and component relationships. Use for documentation, PR descriptions, and architectural analysis."
---
# Diagram Generation Skill
Generate Mermaid diagrams to visualize architecture, data flows, and component relationships.
## When to Use
Use this skill when:
- Documenting architecture
- Explaining complex changes in PRs
- Visualizing data flows
- Understanding component relationships
- Revealing architectural issues
## Capabilities
### Architecture Diagrams
- System architecture
- Component relationships
- Service interactions
- Module dependencies
### Data Flow Diagrams
- Request/response flows
- Data transformation pipelines
- State management flows
- Event flows
### Sequence Diagrams
- API call sequences
- User interaction flows
- Process workflows
- Error handling flows
## Usage
```
Create a Mermaid diagram showing the data flow for our authentication system,
including OAuth providers, session management, and token refresh.
```
## Best Practices
1. **Be specific**: Describe what you want to visualize
2. **Include context**: Mention relevant files or components
3. **Review diagrams**: Verify accuracy and completeness
4. **Use in docs**: Add diagrams to documentation
5. **Update regularly**: Keep diagrams current with code
## Related Resources
- Rule: `.cursor/rules/large-codebase-patterns.mdc`
- Command: `/diagram`
- Agent: `.cursor/skills/diagram-generation/agents/diagram-generator.md`
