Step Forms

Multi step forms

Get Started

1

Bulma Steps New

Rounded step form

Bulkit comes with the Steps Bulma extension. This way, you can easily build a step form for your registration, checkout or whatever process you want to build. Step forms navigation is controlled with javascript.

1

Account

2

Profile

3

Social

4

Finish

Your account is now created!

You can now login with your credentials and start using the App

Squared step form

You can make the edges of the steps indicators squared. Add the .is-squared class to the .steps-wrapper parent element to make the indicators squared.

1

Account

2

Profile

3

Social

4

Finish

Your account is now created!

You can now login with your credentials and start using the App

Animated step form

You can easily animate a step form by adding animation classes to the .steps-content element. For example, the form below uses the .fadeInUp animation.

1

Account

2

Profile

3

Social

4

Finish

Your account is now created!

You can now login with your credentials and start using the App

Double Columns steps

You can organize fields with the bulma grid inside a step form. Just create a grid and place the fields inside columns.

1

Account

2

Profile

3

Social

4

Finish

Your account is now created!

You can now login with your credentials and start using the App