Sam's Blog

Pure HTML & CSS Buttons

Posted on 19 Mar 2014

I love doing things as simple as I can and that includes in web development, like buttons:

Sam on Twitter

In my mind a button is a glorified link and a nice simple button is a style class or two away. Here’s a little JSFiddle for an example:

Pretty simple, but you can make them more complicated by embedding an SVG icon, but I talk about that in another post/

All the border:none; and outline:none; in the .button classes are there to override any user-agent stylesheets that like to theme buttons and make yours less pretty. :)


Recent Posts

How to Run a Usability Test27 Aug 2019
Joining Purism!30 Jul 2019
Taking the "User" out of Design20 Feb 2019
Basic Linux Virtualization with KVM16 Feb 2019
Moving Beyond Themes05 Aug 2018