Different button types
<button type="submit">Go to checkout</button>
<button type="submit" class="button">Go to checkout</button>
<button type="submit" class="button-primary">Go to checkout</button>
<button type="submit" class="button-text">Go to checkout</button>
<button type="submit" class="button-primary"><i class="fa fa-check"></i></button>
<button type="submit" class="button-primary"><i class="fa fa-check"></i> Go to checkout</button>
<button type="submit" class="button-primary is-block">Go to checkout</button>
<button type="submit" class="button-primary is-block"><i class="fa fa-check"></i></button>
<button type="submit" class="button-primary is-block"><i class="fa fa-check"></i> Go to checkout</button>
<button class="button button-icon"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<button class="button-primary button-icon"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
On a A-tag
<a href="#" class="button">Go to checkout</a>
<a href="#" class="button-primary">Go to checkout</a>
<a href="#" class="button-text">Go to checkout</a>
<a href="#" class="button-primary"><i class="fa fa-check"></i> Go to checkout</a>
<a href="#" class="button-primary is-block">Go to checkout</a>
<a href="#" class="button-primary is-block"><i class="fa fa-check"></i> Go to checkout</a>
<a class="button-primary button-icon"><i class="fa fa-shopping-cart"></i>Go to checkout</a>
<fieldset class="form-group">
<div style="width: 40%; float: left; margin-right: 10px;">
<input type="text" class="form-input">
</div>
<div style="width: 50%; float: left;">
<a href="#" class="button-primary">Go to checkout</a>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input">
</div>
<div style="width: 25%; float: left;">
<a href="#" class="button-primary is-block">Go to checkout</a>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input">
</div>
<div style="width: 25%; float: left;">
<a class="button-primary button-icon"><i class="fa fa-shopping-cart"></i>Go to checkout</a>
</div>
</fieldset>
Disaled
<button disabled="disabled" type="submit">Go to checkout</button>
<button class="button button-icon" disabled="disabled"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<button class="button-primary button-icon" disabled="disabled"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<a class="is-disabled button-primary button-icon"><i class="fa fa-shopping-cart"></i>Go to checkout</a>
<a class="is-disabled button button-icon"><i class="fa fa-shopping-cart"></i>Go to checkout</a>
Button types with sizes
<button type="submit" class="large">Go to checkout</button>
<button type="submit" class="button large">Go to checkout</button>
<button type="submit" class="button-primary large">Go to checkout</button>
<a type="submit" class="button-primary large">Go to checkout</a>
<button type="submit" class="button-text large">Go to checkout</button>
<button class="button-primary button-icon large"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<button class="button button-icon large"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<fieldset class="form-group">
<div style="width: 40%; float: left; margin-right: 10px;">
<input type="text" class="form-input large">
</div>
<div style="width: 50%; float: left;">
<button type="submit" class="button-primary large">Go to checkout</button>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input large">
</div>
<div style="width: 25%; float: left;">
<button type="submit" class="button-primary large is-block">Go to checkout</button>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input large">
</div>
<div style="width: 25%; float: left;">
<button class="button-primary button-icon large"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
</div>
</fieldset>
Default
<button type="submit" class="default">Go to checkout</button>
<button type="submit" class="button default">Go to checkout</button>
<button type="submit" class="button-primary default">Go to checkout</button>
<a type="submit" class="button-primary default">Go to checkout</a>
<button type="submit" class="button-text default">Go to checkout</button>
<button class="button-primary button-icon default"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<button class="button button-icon default"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<fieldset class="form-group">
<div style="width: 40%; float: left; margin-right: 10px;">
<input type="text" class="form-input default">
</div>
<div style="width: 50%; float: left;">
<button type="submit" class="button-primary default">Go to checkout</button>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input default">
</div>
<div style="width: 25%; float: left;">
<button type="submit" class="button-primary default is-block">Go to checkout</button>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input default">
</div>
<div style="width: 25%; float: left;">
<button class="button-primary button-icon default"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
</div>
</fieldset>
Smal
<button type="submit" class="small">Go to checkout</button>
<button type="submit" class="button small">Go to checkout</button>
<button type="submit" class="button-primary small">Go to checkout</button>
<a type="submit" class="button-primary small">Go to checkout</a>
<button type="submit" class="button-text small">Go to checkout</button>
<button class="button-primary button-icon small"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<button class="button button-icon small"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<fieldset class="form-group">
<div style="width: 40%; float: left; margin-right: 10px;">
<input type="text" class="form-input small">
</div>
<div style="width: 50%; float: left;">
<button type="submit" class="button-primary small">Go to checkout</button>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input small">
</div>
<div style="width: 25%; float: left;">
<button type="submit" class="button-primary small is-block">Go to checkout</button>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input small">
</div>
<div style="width: 25%; float: left;">
<button class="button-primary button-icon small"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
</div>
</fieldset>
Xsmal
<button type="submit" class="xsmall">Go to checkout</button>
<button type="submit" class="button xsmall">Go to checkout</button>
<button type="submit" class="button-primary xsmall">Go to checkout</button>
<a type="submit" class="button-primary xsmall">Go to checkout</a>
<button type="submit" class="button-text xsmall">Go to checkout</button>
<button class="button-primary button-icon xsmall"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<button class="button button-icon xsmall"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
<fieldset class="form-group">
<div style="width: 40%; float: left; margin-right: 10px;">
<input type="text" class="form-input xsmall">
</div>
<div style="width: 50%; float: left;">
<button type="submit" class="button-primary xsmall">Go to checkout</button>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input xsmall">
</div>
<div style="width: 25%; float: left;">
<button type="submit" class="button-primary xsmall is-block">Go to checkout</button>
</div>
</fieldset>
<fieldset class="form-group">
<div style="width: 70%; float: left; margin-right: 10px;">
<input type="text" class="form-input xsmall">
</div>
<div style="width: 25%; float: left;">
<button class="button-primary button-icon xsmall"><i class="fa fa-shopping-cart"></i>Go to checkout</button>
</div>
</fieldset>