# Disallow the usage of non-standard fonts (`@greenpoint/only-standard-font-use`)

⚠️ This rule _warns_ in the ✅ `recommended` config.

<!-- end auto-generated rule header -->

## Rule Details

This rule aims to encourage the use of standard fonts that are already present in the browser and don't need to be downloaded

The list of standard fonts is based: - on the commmon fonts supported by the browsers of the most common operating systems (Linux, macOS, Windows, Android, iOS) :
[ "arial",
"verdana",
"tahoma",
"trebuchet ms",
"times new roman",
"georgia",
"courier new",
"comic",
"impact",
"segie ui"
] - the system-ui fonts that are used by the browsers by default :
[ "sans-serif",
"serif",
"sans-serif",
"monospace",
"cursive",
"fantasy",
"system-ui"]
For more details you can check the following websites:
[system-fonts/modern-font-stacks](https://github.com/system-fonts/modern-font-stacks)
[revised-font-stack](https://www.awayback.com/index.php/2010/02/03/revised-font-stack/)
[List of typefaces included with macOS](https://en.wikipedia.org/wiki/List_of_typefaces_included_with_macOS)

## Examples

Examples of **non-compliant** code for this rule:

```js
<h1 style={{ fontFamily: "MontSerrat" }} />
```

or

```js
<style fontFamily="MontSerrat" />
```

Examples of **compliant** code for this rule:

```js
<h1 style={{ fontFamily: "Arial" }} />
```

or

```js
<style fontFamily="Arial" />
```

## Further Reading

- [cnumr/best-practices/Prefer standard fonts](https://github.com/cnumr/best-practices/blob/fc5a1f865bafb196e4775cce8835393751d40ed8/chapters/BP_029_en.md)