HTML Buttons

Every time I build a website for a client there are repetitive tasks that dominate the amount of time spent on the project. One of these, for me, has always been designing and coding buttons.

But why should buttons take any longer to design and code than anything other part of a website?

I think it's because clients are drawn to the buttons on their shiny new website. It's the thing we want the user to click on (e.g. 'Buy Now') and therefore they stand out.

So the client fusses over the button: "Can we try it in green, on the right, on the left, bigger, no wait - smaller?"

All the while I'm furiously writing CSS that gets messier and messier and then we want an icon inline. Simple enough, so many ways to go about it. Do we design an icon? Or use something like Font Awesome? Again, the client fusses over which icon, whether it comes before or after the text, how big it should be and on it goes.

Let's assume though that we do reach an agreement, now I'm building content pages for the new website and I find I want a call to action button on the left. Now I need one right aligned and some with icons, some without.

I found every time I wrote a website I was essentially developing a 'button toolkit' to accommodate all these slight design variants.

Why not formalise that into a robust toolkit that I can use on any web project?

And, at the same time, create a platform in which I can work with the client much faster designing buttons visually and sharing the designs with them in a video call or similar.

So that's why HTML Buttons exists. It's just a handy little toolkit that, now I've built it, is solving my buttons problem in a way that suits me.

It's free to use and 'open source' so if you want to use it too go right ahead.