Buttons
HTML
<p>
<input type="submit" class="Btn button" value="input[submit]" />
<input type="reset" class="Btn button" value="input[reset]" />
<button class="Btn button" >button</button>
<a href="#" class="Btn button" >a.button</a>
</p>
Buttons Disabled
HTML
<p>
<input type="submit" disabled class="Btn button" value="input[submit]" />
<input type="reset" disabled class="Btn button" value="input[reset]" />
<button class="Btn button" disabled>button</button>
<a href="#" class="Btn button" disabled>a.button</a>
</p>
Full Width Buttons
HTML
<p>
<input type="submit" class="Btn Btn-Block" value="input[submit]" />
</p>
<p>
<input type="reset" class="Btn Btn-Block" value="input[reset]" />
</p>
<p>
<button class="Btn Btn-Block" >button</button>
</p>
<p>
<a href="#" class="Btn Btn-Block" >a.button</a>
</p>
Pill Buttons
HTML
<p>
<input type="submit" class="Btn Btn-Pill" value="input[submit]" /><!--
--><input type="reset" class="Btn Btn-Pill" value="input[reset]" /><!--
--><button class="Btn Btn-Pill" >button</button><!--
--><a href="#" class="Btn Btn-Pill" >a.button</a>
</p>
Alt Buttons
HTML
<p>
<input type="submit" class="Btn Btn-Alt" value="input[submit]" />
<input type="reset" class="Btn Btn-Alt" value="input[reset]" />
<button class="Btn Btn-Alt" >button</button>
<a href="#" class="Btn Btn-Alt" >a.button</a>
</p>
Alt Buttons Disabled
HTML
<p>
<input type="submit" disabled class="Btn Btn-Alt" value="input[submit]" />
<input type="reset" disabled class="Btn Btn-Alt" value="input[reset]" />
<button class="Btn Btn-Alt" disabled>button</button>
<a href="#" class="Btn Btn-Alt" disabled>a.button</a>
</p>
Buttons With Icons
HTML
<p>
<button class="Btn button" ><svg class="Icon Icon-Envelope"><use xlink:href="../../assets/images/Icon/symbol-defs.svg#Icon-Envelope"></use></svg> button</button>
<a href="#" class="Btn button" ><svg class="Icon Icon-LinkedIn"><use xlink:href="../../assets/images/Icon/symbol-defs.svg#Icon-LinkedIn"></use></svg> a.button</a>
</p>