The whole space below is a big canvas to draw your state machine.

• Add a state: double-click on the canvas
• Add an arrow: select one state, and then shift-click on a target state
• Move something: drag it around
• Delete something: click it and press the delete key (not the backspace key)

State Machine Designer by David Gavilan (c) 2013 (MIT License)

Based on the FSM Designer by Evan Wallace, all the code has been replaced to use Dracula Graph Library and Twitter Bootstrap 3.

          (autogenerated code will appear here)