Question about fonts

Where can i find supported fonts for html?

Go to an HTML cheatsheet, or something like it. There may be fonts varying by machine. Like all of Google Fonts are installed on chrome os

You can get custom fonts at Google Fonts:

Also see:

Most fonts on your computer you should be able to use.


The font family property in css allows you to select what type of font you want. For example the font you are seeing right now is produced by font-family:Sans-Serif
If this looks coding-ish then this is produced by font-family: Monospace
With that I’ll leave you with some documentation and more values for font family
https://developer.mozilla.org/en-US/docs/Web/CSS/font-family

If you’re looking to select only one font checkout just the font property.
https://developer.mozilla.org/en-US/docs/Web/CSS/font

Keep in mind if the person visiting your site doesn’t have the font installed the browser will fallback to defaults.
If you want a cool font, and not depend on your user having it installed locally then you can load them externally from a service like Google Fonts

2 Likes

I think we get a bit more fonts, like Google Sans.

Hi AEK, welcome!

With fonts in HTML, you’ve got two main options:

  1. Use a font that you’re pretty sure is already installed on 99% of computers and phones. Here’s a slightly old page that should give you an idea of what you can choose from: https://www.ampsoft.net/webdesign-l/WindowsMacFonts.html … it’s quite a limited selection :slight_smile:
  2. Use a “web font”, a font file that you send to the visitor as part of your website. For this, a lot of people use Google Fonts. See RiversideRocks’ answer.

Lastly, I just want to shout-out to the “universal system font rule” used by sites like GitHub. It’s made to display your site in the “system font” so that it looks like a native app, by trying lots of different native fonts in a specific order:

font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;

Have fun!

4 Likes

Yeah, it gets that SweetAlert2 touch, I guess

1 Like