Should the font of buttons on a website be different than the font on the rest of the page? How different? More spacing, less spacing, different font-family? What are the things to consider when choosing button fonts?

2 Answers 2


The big question is 'serif' or 'sans-serif'.

A review of literature cites numerous arguments that have been made for and against the legibility and readability of each - all of which have very tenuous evidence at best to back them up. Sans serif fonts are widely used and Verdana very popular for this role. Seems a good choice, even on a site that is using a serif font for body text. You only want legibility, not readability on a button.

Call to action buttons should have big bold text on them. A lighter sub text in a smaller font on the same button can keep people reading longer, keeping their attention on the button.

You're not trying to save space on buttons since it makes little difference to the overall area of a page. Closer than normal spacing is not helpful. Nor is wider than normal spacing, as it makes it harder for the brain to take words in as a gestalt. The button will hold their attention on the words less.

If you are using a dark button with light text, then use a bolder font to get the same apparent weight as dark text on light button.

Beyond that, no rules, do what everyone else does (consistency) and what looks right (aesthetics).


If you are using image based buttons you have a bit more freedom, but if the text is dynamically generated make sure that you choose a standard font. There are ways around this with the use of @fontface, but it is important to be careful when choosing fonts to make sure they appear as intended for you users.

Whatever font that you do choose, make sure it goes with the design of the page.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.