Web Safe Fonts

Web Safe Fonts

1. Arial (sans-serif)
2. Arial Black (sans-serif)
3. Verdana (sans-serif)
4. Tahoma (sans-serif)
5. Trebuchet MS (sans-serif)
6. Impact (sans-serif)
7. Times New Roman (serif)
8. Didot (serif)
9. Georgia (serif)
10. American Typewriter (serif)
11. Andalé Mono (monospace)
12. Courier (monospace)
13. Lucida Console (monospace)
14. Monaco (monospace)
15. Bradley Hand (cursive)
16. Brush Script MT (cursive)
17. Luminari (fantasy)
18. Comic Sans MS (cursive)

 

1. Arial (sans-serif)

Arial is the most widely used sans-serif font on the web. It was created for printers who wanted to use the popular Helvetica font without the licensing fees. Therefore, they’re virtually identical.

Arial and members of the Arial font family are considered the safest web fonts because they’re available on all major operating systems.

2. Arial Black (sans-serif)

Arial Black is another related font in the Arial family. It's a very bold version more suitable for headers, decorative text, and emphasized text. However, its prominence means designers should use it strategically and carefully.

3. Verdana (sans-serif)

Verdana is popular both online and off. While it resembles Arial and Helvetica, it has a simple structure that makes the letters large and clear. Some of its characters have elongated lines, which may be incompatible with some designs. Otherwise, it's a solid alternative to Arial.

4. Tahoma (sans-serif)

Similar to Verdana, the Tahoma font sports a bolder weight and narrower tracking (i.e. less space between characters).

5. Trebuchet MS (sans-serif)

Trebuchet MS is another web-safe sans-serif font, designed by the Microsoft Corporation in 1996. It’s commonly used for the body copy of many websites and can be a solid alternative to your site’s sans-serif font. It also may not look as “basic” as Arial.

6. Impact (sans-serif)

Impact is a heavy sans-serif font great for drawing attention and creating … well, impact. It’s also notable for being a particularly narrow font — it’s characters have a higher width-to-height ratio than other comparable fonts.

Impact was first introduced to digital devices in Microsoft Windows in 1998 and has since seen a resurgence in popularity in internet memes, superimposed atop images for a humorous effect.

7. Times New Roman (serif)

Times New Roman is the ultimate serif font. It's extremely popular and the primary font for Windows devices and applications, like Microsoft Word. Browsers revert to it when the specified font can’t be displayed.

Technically, Times New Roman is an updated version of the Times newspaper font, which is used in print newspapers and, as a result, is one of the most recognizable fonts in the world.

8. Didot (serif)

This old French typeface was originally used for printing presses. It’s notable for its elegant aesthetic and can add a formal quality to your copy.

9. Georgia (serif)

Georgia is another elegant serif font, but was designed to be more readable at different font sizes than other serif fonts. It accomplishes this with a heavier weight, making it an ideal candidate for mobile-responsive design.

10. American Typewriter (serif)

If you want to invoke a classic, nostalgic quality with your text, this is an ideal font to do it. American Typewriter imitates typewriter print and works well for stylized body text.

11. Andalé Mono (monospace)

Monospaced fonts have letters that are spaced equally apart, lending a mechanical quality to the text.

Andalé Mono is a perfect example of a monospace font. This sans-serif option was developed by Apple and IBM and has been frequently used in software development environments.

12. Courier (monospace)

Courier is a monospace serif font that closely resembles typewriter text. Many email providers use it as their default font. It's also widely used with coding application displays.

Note that the font Courier New is in the same family as Courier. You can list Courier after Courier New in your font stack to provide two different, but similar, options to the browser.

13. Lucida Console (monospace)

Lucida Console was designed to be a highly legible monospaced iteration of the broader Lucida typeface. It is monospace, but resembles human handwriting more than other monospace options we’ve covered, thus appearing less mechanical.

14. Monaco (monospace)

The monospace sans-serif Monaco font is native to macOS and will be more familiar with Apple users as a result.

15. Bradley Hand (cursive)

Based on designer Richard Bradley's handwriting, this calligraphic typeface evokes a casual, personal quality. It’s ideal for use in headings, decorative text, and short bodies of text.

16. Brush Script MT (cursive)

Brush Script MT is a heavily embellished script font designed to mimic quick handwritten strokes. While it can evoke nostalgia in some readers, it’s best to limit this font to decorative uses, as its style comes at the cost of legibility.

17. Luminari (fantasy)

Fantasy fonts are typically decorative and best used in headlines that only contain a few words. Luminari is a decorative font with a medieval quality. Use it to add a gothic essence to your web pages.

18. Comic Sans MS (cursive)

At last, we arrive at the font that everyone likes to poke fun at, Comic Sans. Designed to imitate the style of lettering found in comic books, Comic Sans MS carries an informal connotation and has been the target of many an internet joke.

Still, Comic Sans is useful for accessibility reasons: Because it lacks similar letterforms like p/q and b/d, people with dyslexia tend to experience less difficulty with it than with commonplace fonts.

 

참조: https://blog.hubspot.com/website/web-safe-html-css-fonts

The Ultimate List of Web-Safe HTML and CSS Fonts