Flow Visualizer
Upload a Salesforce Flow XML file to generate a Mermaid.js diagram. Useful for visualizing complex flows offline or documenting architecture.
Upload Flow XML
.flow, .flow-meta.xml
Flow Visualizer
Understanding complex Salesforce Flows directly from raw XML or navigating through the slow Salesforce Setup UI can be incredibly time-consuming. The Salesforce Flow Visualizer solves this by instantly transforming your `.flow` metadata files into interactive, high-fidelity Mermaid.js diagrams, entirely offline.
Instant Architectural Views
Upload a `.flow` file and immediately see the logical paths, Decision outcomes, Loops, and DML operations. It is an invaluable tool for code reviews and architectural planning, ensuring the flow's logic matches business requirements.
Interactive Elements
The generated flowchart isn't just static. You can interact with nodes to view exact configuration details, zoom in on dense logic trees, and switch between light and dark themes to match your presentation style.
Export for Documentation
Documenting flows is traditionally painful. With the built-in SVG and PNG export buttons, you can generate crisp diagrams that drop perfectly into your technical design documents (TDDs) or wiki pages.
100% Privacy Focused
Your `.flow` files contain proprietary business logic. By leveraging local browser execution for XML parsing and rendering, we guarantee zero data exposure. Process sensitive metadata safely.
How to Visualize a Flow
- Export Metadata: Retrieve your Flow XML files using the Salesforce CLI (sfdx), VS Code, or package.xml.
- Upload: Drag and drop the `.flow` or `.flow-meta.xml` file into the primary input area.
- Analyze: The tool will instantly parse the connections, decisions, and outcomes, rendering the flowchart.
- Export & Document: Use the SVG or PNG download buttons to save the diagram for your team.
Frequently asked
Related Tools
Test Coverage Visualizer
Visualize Apex test coverage heatmaps from SFDX JSON output.
ERD Generator
Generate Entity Relationship Diagrams from Salesforce describe API JSON.
SF Dependencies Viewer
Visualize Salesforce object, class, and flow dependencies from package.xml as a Mermaid graph.
Regex Visualizer
Visualize regular expressions as railroad diagrams with plain-English explanations.
Mermaid Diagram Editor
Write Mermaid syntax with live SVG preview. Flowcharts, sequence diagrams, ERDs, Gantt, class diagrams.
Docker Compose Visualizer
Visualize Docker Compose services, networks, and volumes as an interactive diagram.