Visualize your application logic
A suite of visual tools for building app logic. Powered by XState, a best-in-class open source library for handling complexity at scale.
Visual editor: Visualize your application logic
Use our drag-and-drop visual editor to build your application logic, then export it directly into your XState project.
XState in production
Statecharts: Collaborate with everyone on the team
Not just for developers. Statecharts are a visual language that everyone on the team can understand. Our editor and visualizer make it easy for anyone to create and edit application logic.
IDE Extension: Upgrade your workflow
State management: Make complexity manageable
Statecharts make state management simpler. Get an overview of how your application works at a glance. Find states that are often missed, including unwanted states, impossible states and unnecessary error states. As well as eliminating bugs and other issues caused by boolean-based state management.
Registry: Explore and share
Share your machines with the community, get feedback and kudos for your work.
Powered by XState
XState is a robust, production-proven library for building application logic with state machines.
No framework required
Packages and templates for React, Vue and Svelte
Speedy integration with React, Vue, Svelte and more, with our dedicated packages and templates.
Works anywhere in your stack
Use state machines to orchestrate state in both frontend and backend environments. Watch us discuss interesting uses of state machines in our office hours.
Robust and production-proven
Used in production by many big and small teams across the world. Convince your team to use XState.
Mature project with 22k+ GitHub stars
3+ years of development and a dedicated full-time team improving the tooling every day. Check out the GitHub repository.
Friendly and helpful community
Join our Discord to give us feedback and get support.
Loved by teams
Every team where I introduced XState has been more effective at handling state management with complex user interfaces. It fills a gap in the JS ecosystem no other tool did before.
We've been using XState for our new payments product. Shout out to the team that is making designing complex front-end flows a dream.
XState is a revelation. It makes complex tasks easier to build and debug while also making the code more straightforward and approachable
@ Domestic Data Streamers
Thinking and building with XState has been a revolution in how I develop robust business logic. But being able to visualize that in real time, has been a game changer in how I model and communicate any logic!
XState naturally separates the logic and makes it simple to mock out API calls, so it's easier to test the code and organize it!
Advantages of XState: Visually clear view of the code flow, code reusability, test coverage, easy to debug/ spot bugs, code scalability & maintenance, and better code design & planning
We use XState to implement business workflows as statecharts. The visualizer helps us collaborate more closely with customers, the ability to externalize workflows as JSON configuration makes complex workflow changes surprisingly simple to roll out, and test case generation makes it easier than ever to move forward with confidence. XState makes it all possible!