Button & List.

Button Element

<!-- Button -->
<button class="button">Button</button>

<!-- Anchor  -->
<a href="#" class="button">Anchor Button</a>

<!-- Input Submit -->
<input type="submit" class="button" value="Submit Button">

<!-- Input Button -->
<input type="button" class="button" value="Input Button">

<!-- Anchor Button Link -->
<a href="#" class="button link">Link Button</a>

<!-- Anchor Button Icon -->
<a href="#" class="button">Icon Button <i class="icon-circleright"></i></a>

Button Anchor Button Link Button Icon Button

Button Color

<!-- Button Color Default -->
<a href="#" class="button">Button Default</a> 

<!-- Button Color Green -->
<a href="#" class="button green">Button Green</a> 

<!-- Button Color Blue -->
<a href="#" class="button blue">Button Blue</a> 

<!-- Button Color Yellow -->
<a href="#" class="button yellow">Button Yellow</a>

<!-- Button Color Red -->
<a href="#" class="button red">Button Red</a> 

<!-- Button Color Grey -->
<a href="#" class="button grey">Button Grey</a>   

<!-- Button Color White -->
<a href="#" class="button white">Button White</a>     

Button Default Button Green Button Blue Button Yellow Button Red Button Grey Button White

Button Group

Button Group
Button Group
Button Group

<!-- Button Group Small -->
<a class="button small button-group" href="#">Button Group
   <span><i class="icon-chevron-right"></i></span>
</a>

<!-- Button Group Default -->
<a class="button button-group" href="#">Button Group
   <span><i class="icon-chevron-right"></i></span>
</a>

<!-- Button Group Large -->
<a class="button large button-group" href="#">Button Group
   <span><i class="icon-chevron-right"></i></span>
</a>
               

Button Size

Small Button
Default Button
Large Button

<!-- Button Small -->
<a href="#" class="button small">Small Button</a>

<!-- Button Default -->
<a href="#" class="button">Default Button</a>

<!-- Button Large -->
<a href="#" class="button large">Large Button</a>

Button Style

Button Block Button Radius
Button Round
Button Border
Round Border
Radius Border

<!-- Button Block -->
<a href="#" class="button button-block">Button Block</a>

<!-- Button Radius -->
<a href="#" class="button radius">Button Radius</a>

<!-- Button Round -->
<a href="#" class="button round">Button Round</a>

<!-- Button Border -->
<a href="#" class="button button-border">Button Border</a>

<!-- Button Border with Round -->
<a href="#" class="button button-border round">Round Border</a>

<!-- Button Border with Radius -->
<a href="#" class="button button-border radius">Radius Border</a>            

---

List

class="list-circle-check"

• List Item
• List Item
• List Item
  • List Item
  • List Item
  • List Item
• List Item
• List Item
• List Item

class="list-arrow"

• List Item
• List Item
• List Item
  • List Item
  • List Item
  • List Item
• List Item
• List Item
• List Item

class="list-arrow-circle"

• List Item
• List Item
• List Item
  • List Item
  • List Item
  • List Item
• List Item
• List Item
• List Item

class="no-bullet"

• List Item
• List Item
• List Item
  • List Item
  • List Item
  • List Item
• List Item
• List Item
• List Item

class="disc"

• List Item
• List Item
• List Item
  • List Item
  • List Item
  • List Item
• List Item
• List Item
• List Item

class="square"

• List Item
• List Item
• List Item
  • List Item
  • List Item
  • List Item
• List Item
• List Item
• List Item