Explore Templates

Vertical Wizard

Examples for the UI of wizard allow you to display content in vertical steps.

Default wizard

Check the basic example of vertical wizard. Using the wrapper class of .hk-wizard .hk-wizard-vertical.

Finished
This is a description.
2
In Progress
This is a description.
3
Waiting
This is a description.
Wizard sm

Add class .hk-wizard-sm with .hk-wizard for sm wizard.

Finished
This is a description.
2
In Progress
This is a description.
3
Waiting
This is a description.
Dot style

Check the dot style wizard. Use class .hk-wizard-dot.

Finished
This is a description. This is a description.
Finished
This is a description. This is a description.
In Progress
This is a description. This is a description.
Waiting
This is a description.
Waiting
This is a description.