Button is meant to direct users into taking the action you want them to take. If you are looking for some CSS buttons to use in a website project, here are 20 cool and modern CSS buttons that will save you time and effort in creating effective buttons that improves the user experience.
It is pure HTML5/CSS3 flat buttons. Buttons has HTML5 structure and works on all major browsers. Buttons is easy to edit and integrate into any website. CSS is separate from HTML and is well commented.
Awesome buttons for awesome projects!
Distorted Button Effects
A set of inspirational, highly experimental distortion effects for buttons using SVG filters. By Adrien Denat.
Simple button styles to kickstart you webdesign!
Social Likes Next
Modern social share buttons. All in the same style, no jQuery, Retina, IE11+.
“Hand-Drawn” border effect on buttons w/CSS border-radius.
Some button hover effects using psuedo elements and borders.
Modern CSS3 buttons collections. It’s have 24+ buttons and 3 social button styles. It’s used standard CSS3 technology possible to huge combinations. You can use this button on your project easily.
Bootstrap Responsive Button
Flat design Bootstrap buttons. Easy customization.Support Font Awesome icon. Crossbrowser supported and Responsive. Up to 50 colors, 2 different shapes.
Fancy Buttons are made with HTML & CSS3, Retina ready, Crossbrowser supported and Responsive. Up to 16 colors, 16 pure CSS3 combinable animations, 4 different shapes and 4 different sizes. All of them can be combined together.
Rotating Icon Buttons
Hover over the buttons to see the colors invert, the icon rotate, and the border grow from within the button.
Inspiration for new ways to make interactive buttons using linear-gradients, box-shadows, and pseudo classes!
Contact button from dribbble shot. Only for fun.
Script automatically adds the material design effect to elements with ‘material-design’ class. Can also be used on div with images. Add the preferred color as value of the ‘data-color’ attribute.
Buttons css hover effect
These are nice, and would be even cooler if they used transforms for the hover effect!
Just some other awesome CSS3 buttons.
Buttons with pattern animation hover effect in CSS.
Random button animation created in a single HTML element for fun.
These buttons offer a Bootstrap alternative between the gradient-opinionated 2.0 and the completely-flat 3.0. They are also distinguished for getting pressed on click, like real buttons do.