What's the closest web-safe font to Roboto?

I need to know this in order to provide a decent alternative to Roboto for my apps.

UPDATE: reading the answers, it's clear that the concept of web safe needs to be clarify. Actually I'm referring to the webdev concept of web safe: http://www.w3schools.com/csSref/css_websafe_fonts.asp

which includes the following:

  • Georgia, serif
  • "Palatino Linotype", "Book Antiqua", Palatino
  • "Times New Roman", Times
  • Arial, Helvetica, sans-serif
  • "Arial Black", Gadget
  • "Comic Sans MS", cursive
  • Impact, Charcoal
  • "Lucida Sans Unicode", "Lucida Grande"
  • Tahoma, Geneva
  • "Trebuchet MS", Helvetica
  • Verdana, Geneva
  • "Courier New", Courier, monospace
  • "Lucida Console", Monaco
  • 3
    What do you mean by "web-safe"? Roboto is available on Google fonts. Is there a reason you don't want to use that service (or use @font-face)? – Scribblemacher Oct 10 '16 at 12:30
  • Hello ling, welcome to GD.SE and thanks for your question. Could you please include a screenshot of Roboto, so we don't have to look it up before starting to look for alternatives? Thanks! If you have any questions about this Stack site, have a look at the help center or feel free to join us in Graphic Design Chat. Keep contributing and enjoy the site! – Vincent Oct 10 '16 at 13:10
  • @Scribblemacher See my update question for web safe concept. The reason I'm looking for it is to provide a font fallback, just in case a problem occurred (like google's cdn server going down, I know that's hypothetical, but I feel safer if I set a fallback). – ling Oct 10 '16 at 13:36
  • @Vincent Here is the screenshot (sort of): fonts.google.com/specimen/Roboto – ling Oct 10 '16 at 13:37
  • 1
    In that case if it is web safe you want I would say your best option is arial/helvética – Joana Ribeiro Oct 10 '16 at 17:10

The "web-safe" is a little arcaic concept.

It is more likely that your site dissapear before google stop supporting the fonts it has listed. So any alternative to other "google fonts" has no sense.

If you want to complement your style use:

font-family: "Roboto", Arial, Helvetica, sans-serif;
  • 1
    Make sure that you include the font using @import or something as well – Zach Saucier Oct 10 '16 at 14:38
  • 9
    “web-safe” is not an archaic concept. Font faces are typically in the 20–50kb range, per face, and many designs make use of 5+. When you're building content to be served to 100k individuals in Nigeria, Ghana, and Pakistan, you've got a budget of about 500kb for the entire page, including headers. If you don't provide curated web-safe alternates, you have no control and you're about to deliver a really shitty experience (or none at all if the user hits the back button). – coreyward Oct 3 '17 at 23:23
  • If you actually add the rules to import the fonts, they will be imported. If you really want an "economic" website you prepare a light website from start, probably an AMP page. – Rafael May 4 '20 at 20:44
  • I really don't understand how this is an archaic concept. Even more important than the cases enumerated above regarding the internet speed in some regions, the most important aspect of why you would want to provide very similar alternative fonts is FOUT. that brief fraction of a second where the text is rendered using fonts on the machine, until the desired font is loaded via Internet. That brief second can show a dramatic shift in content, or almost none at all, depending how well the alternative fonts are chosen. This concept is very relevant even today. – brett Apr 15 at 12:41

Roboto web safe as it is a google font but if by some reason you want to pull away from Roboto, Open Sans or Droid are good matching fonts.

1] 2] 3]

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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