Button color options include:
- Blue
- Gold
- Black
- Dark Gray
- Light Gray
- White
Examples
Normal Buttons
Button <a href="#" class="button button-blue">Button</a>
Button <a href="#" class="button button-gold">Button</a>
Button <a href="#" class="button button-black">Button</a>
Button <a href="#" class="button button-gray-dark">Button</a>
Button <a href="#" class="button button-gray-light">Button</a>
Button <a href="#" class="button button-white">Button</a>
Small Buttons
Button <a href="#" class="button button-small button-blue">Button</a>
Button <a href="#" class="button button-small button-gold">Button</a>
Button <a href="#" class="button button-small button-black">Button</a>
Button <a href="#" class="button button-small button-gray-dark">Button</a>
Button <a href="#" class="button button-small button-gray-light">Button</a>
Button <a href="#" class="button button-small button-white">Button</a>
Large Buttons
Button <a href="#" class="button button-large button-blue">Button</a>
Button <a href="#" class="button button-large button-gold">Button</a>
Button <a href="#" class="button button-large button-black">Button</a>
Button <a href="#" class="button button-large button-gray-dark">Button</a>
Button <a href="#" class="button button-large button-gray-light">Button</a>
Button <a href="#" class="button button-large button-white">Button</a>
Full Width Buttons
Button <a href="#" class="button button-full button-blue">Button</a>
Button <a href="#" class="button button-full button-gold">Button</a>
Button <a href="#" class="button button-full button-black">Button</a>
Button <a href="#" class="button button-full button-gray-dark">Button</a>
Button <a href="#" class="button button-full button-gray-light">Button</a>
Button <a href="#" class="button button-full button-white">Button</a>
Ghost Buttons
Ghost buttons are buttons with a semi-transparent background and need to be placed on an appropriate background for them to be viewable and accessible.
Button <a href="#" class="button-ghost button-ghost-blue">Button</a>
Button <a href="#" class="button-ghost button-ghost-gold">Button</a>
Button <a href="#" class="button-ghost button-ghost-black">Button</a>
Button <a href="#" class="button-ghost button-ghost-gray-dark">Button</a>
Button <a href="#" class="button-ghost button-ghost-gray-light">Button</a>
Button <a href="#" class="button-ghost button-ghost-white">Button</a>