Buttons

A CSS button library built with Sass & Compass

Download Customize

Flat Buttons

press me press me press me press me press me press me

press me press me press me press me press me press me

press me press me press me press me press me press me

press me press me press me press me press me press me

Glow Buttons

press me press me press me press me press me press me

Rounded Buttons

press me press me press me press me press me press me

3D Buttons

press me press me press me press me press me press me

Border Buttons

press me press me press me press me press me press me

Pill Buttons

press me press me press me press me press me press me

Circle Buttons

press me press me press me press me press me press me

Icon Buttons

press me press me press me press me press me press me

Square Buttons

press me press me press me press me press me press me

Block Buttons

press me
press me
press me
press me
press me
press me

Button Sizes

press me press me press me press me press me

Button Wrappers

press me press me press me press me

Button Form Elements

press me

Getting Started

Setup Buttons

  1. Download Buttons and add files to your website.
  2. Add css in the head of your webpage.
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
    <link rel="stylesheet" href="css/buttons.css">
    
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript" src="js/buttons.js"></script>
    * You only need the font-awesome css if you're using icons
    * You only need jquery & buttons.js if you're using dropdown buttons
  3. Create buttons in your html.

Customize Buttons

  1. Fork or Download the Buttons project on github.
  2. Make sure you have Sass and Compass installed.
  3. Edit the _options.scss with your own custom values
  4. In the root of the Buttons directory type compass watch on the command line.
  5. The buttons.css file should now be updated