Loading editor...

Quick Answer

Our free GraphViz DOT editor lets you create directed graphs, flowcharts, and network diagrams using the DOT language. Multiple layout engines (dot, neato, fdp, circo) and real-time SVG preview.

How It Works

Choose a template or start with a blank graph

Write your graph using DOT syntax

Select a layout engine for your visualization style

View the real-time preview

Export as SVG or PNG

Key Facts

Write graphs using DOT language syntax
Multiple layout engines (dot, neato, fdp, circo, twopi)
Real-time SVG preview as you type
Export as SVG or PNG
Templates for common graph types
Runs entirely in your browser using Graphviz WASM

Frequently Asked Questions

What is DOT language?

DOT is a graph description language. It uses a simple text syntax to define nodes and edges. For example: "A -> B" creates a directed edge from A to B.

Which layout engine should I use?

Use "dot" for hierarchical layouts, "neato" for spring model layouts, "circo" for circular layouts, and "fdp" for large undirected graphs.

Can I customize node and edge styles?

Yes, DOT supports extensive styling options including colors, shapes, fonts, and line styles. Use attributes like [color=red, shape=box].

Is GraphViz installed on my computer?

No installation needed. We use Graphviz compiled to WebAssembly, running entirely in your browser.