Visualizer

Are you looking for the Stately Studio visual editor? Check out the Stately Studio overview.

The Stately Visualizer is a tool for creating and inspecting statecharts to visualize the state of your applications. You can use the viz as a playground for exploring XState’s capabilities.

Stately still supports the Stately Visualizer, but you will find many more advanced features, including Stately Studio visual editor, teams, and shared projects.

As a visual tool, the Visualizer helps developers get an overview of their application logic and makes it easy to share with designers, project managers and the rest of the team.

• Write your application logic and immediately visualize it.
• Save your statecharts to the Stately Registry and share them with anybody.
• Share your statecharts in your team’s documentation with embedded mode and live-updating snapshot images.

Try the Visualizer

• Take me to the Visualizer!
• Try the Visualizer in Inspect mode.

The Visualizer is available now and will be free and open source forever. Contributions are welcome!

Feedback and bug reports

If you have any feedback or feature requests, please join our Discord server, where you’ll find our team and the wonderful Stately community.

Please submit any bug reports as GitHub issues on the XState repository.