t24-button - Awesome Collection of CSS3 Buttons

t24-button - Awesome Collection of CSS3 Buttons

Easy to use.

You need buttons everywhere! So how cool would it be to have a All-in-One solution which has all of the cool CSS styled buttons gathered in one single CSS with lots of effects and modifiers that you may need in every web page or web app.

Full documentation.

Anything that you need to know about creating buttons is in the documentation that you download. Introduction on how to get started, Compatibility notes, button block documentation, and etc…

Most important included files.

The included .js files are completely optional! You may use them only if you’re going to use the SVG Icon styles.

  • ES6 and .scss source files
  • Precompiled .js and .css files


  • Supported on <a>, <button>, and <input> tags
  • Light; it’s only 50KB
  • Easy to use; it’s designed based on BEM Methodology
  • Call-to-action button
  • Button with icon
  • Variety of colors
  • Variety of sizes
  • Block / Icon visual Modifiers
  • Variety of effects
  • Active / Disable / Loading states
  • Variety of predefined loaders (spinners)
  • Combination with other font icon libraries (such as font-awesome)
  • Combination with 24Template utility CSS classes

t24-button Changelog

2017.03.28 – version 1.1.0
 - Added more opacity CSS classes to the Utilities block
 - Updated the Icon block to also change the color of the circle SVG loader
2017.03.22 – version 1.0.0
 - First Release