A set of steps
Steps will automatically stack on mobile. To make steps automatically stack for tablet use the tablet stackable
variation.
Shipping
Choose your shipping options
Billing
Enter billing information
A step can show a ordered sequence of steps
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
A step can be displayed stacked vertically
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
Right vertical steps will show the active arrow to the left
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
A step can contain a description
Shipping
Choose your shipping options
A step can contain an icon
Shipping
Choose your shipping options
Shipping
Choose your shipping options
Billing
Enter billing information
A step can be highlighted as active
Billing
Enter billing information
A step can show that a user has completed it
Billing
Enter billing information
Billing
Enter billing information
A step can show that it cannot be selected
A step can stack vertically only on smaller screens
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
A fluid step takes up the width of its container
Shipping
Choose your shipping options
Billing
Enter billing information
The steps take up the entire column width
A step can prevent itself from stacking on mobile
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
Steps can be attached to other elements
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
Steps can be divided evenly inside their parent
Steps can have different sizes
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
A step's color can be inverted
Shipping
Choose your shipping options
Billing
Enter billing information
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details
Shipping
Choose your shipping options
Billing
Enter billing information
Confirm Order
Verify order details