Button

Colors

      

    <button class="btn-green"> Green </button>  
    <button class="btn-red"> Red </button>  
    <button class="btn-orange"> Orange </button>  
    <button class="btn-yellow"> Yellow </button>  
    <button class="btn-blue"> Blue </button>  
    <button class="btn-purple"> Purple </button>  
    <button class="btn-gray"> Gray </button>  
    <button class="btn-light"> Light </button>  
    

Hover

      

    <button class="btn-green-h"> Green </button>
    <button class="btn-red-h"> Red </button>
    <button class="btn-orange-h"> Orange </button>
    <button class="btn-yellow-h"> Yellow </button>
    <button class="btn-blue-h"> Blue </button>
    <button class="btn-purple-h"> Purple </button>
    <button class="btn-gray-h"> Gray </button>
    <button class="btn-light-h"> Light </button> 
    

Outline

      

    <button class="btn-outline-green"> Green </button>
    <button class="btn-outline-red"> Red </button>
    <button class="btn-outline-orange"> Orange </button>
    <button class="btn-outline-yellow"> Yellow </button>
    <button class="btn-outline-blue"> Blue </button>
    <button class="btn-outline-purple"> Purple </button>
    <button class="btn-outline-gray"> Gray </button>
    <button class="btn-outline-light"> Light </button>
    

Focus

      

    <button class="btn-focus-green" > Green </button>
    <button class="btn-focus-red" > Red </button>
    <button class="btn-focus-orange" > Orange </button>
    <button class="btn-focus-yellow" > Yellow </button>
    <button class="btn-focus-blue" > Blue </button>
    <button class="btn-focus-purple" > Purple </button>
    <button class="btn-focus-gray" > Gray </button>
    <button class="btn-focus-light" > Light </button>
    

Disabled

      

    <button class="btn-green" disabled> Green </button>
    <button class="btn-red" disabled> Red </button>
    <button class="btn-orange-h" disabled> Orange </button>
    <button class="btn-yellow-h" disabled> Yellow </button>
    <button class="btn-focus-blue" disabled> Blue </button>
    <button class="btn-focus-purple" disabled> Purple </button>
    <button class="btn-outline-gray" disabled> Gray </button>
    <button class="btn-outline-light" disabled> Light </button>