Typography - Buttons

Buttons
 
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button blue size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button blue size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button blue size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button blue size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button blue size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button red size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button red size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button red size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button red size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button red size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button green size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button green size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button green size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button green size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button green size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button black size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button black size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button black size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button black size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button black size5">Button 5  <i class="fa fa-check"></i></a>
 
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button filled blue size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled blue size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled blue size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled blue size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled blue size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button filled red size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled red size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled red size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled red size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled red size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button filled green size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled green size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled green size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled green size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled green size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button filled black size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled black size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled black size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled black size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled black size5">Button 5  <i class="fa fa-check"></i></a>
 
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button light size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button light size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button light size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button light size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button light size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button filled size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled size5">Button 5  <i class="fa fa-check"></i></a>
Button 1  
 
Button 2  
 
Button 3  
 
Button 4  
 
Button 5  
 
GET CODE
<a class="jf_typo_button filled light size1">Button 1  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled light size2">Button 2  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled light size3">Button 3  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled light size4">Button 4  <i class="fa fa-check"></i></a>
<a class="jf_typo_button filled light size5">Button 5  <i class="fa fa-check"></i></a>
 
 
Colors