> For the complete documentation index, see [llms.txt](https://toolkit.makeagrid.com/grid-toolkit/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://toolkit.makeagrid.com/grid-toolkit/designing-accessibly/untitled.md).

# Select fonts carefully

## **Fonts matter**

* Serif fonts should be used for body text, and sans serif for headings. This is not a hard and fast rule, but a helpful one if you are trying to decide how to format.
* Do not use many fonts--this is confusing and can look messy. 
* If you need more differentiation, consider bolds, italics, underlines, or changing the weight of the font.

### Support reader's design needs

Some people have difficulty reading the letters on a page. Making good font choices can help make it easier for them to read.

* Sans serif fonts seem less crowded.
* Larger font sizes should be used, at least 12-14 pt.
* Leave extra white space around elements, like headers and paragraphs--it makes it easier to separate out text.

### Consider dyslexic-friendly fonts

Good basic fonts for dyslexia, according to a study, are:

* Helvetica
* Courier
* Arial
* Verdana
* Computer Modern Unicode

{% hint style="info" %}
Use [**Google Fonts**](https://fonts.google.com/) to find and download fonts that best suit your needs.
{% endhint %}

{% hint style="info" %}
[**Fontpair** ](https://www.fontpair.co/)and [**Fontjoy**](https://fontjoy.com/) can help you generate font pairings. 
{% endhint %}

*💡* *GRIDBit: "Serif" indicates the small "feet" of text. Therefore, "sans serif" fonts are slightly simpler in style. Sans serif used to be preferred for screen-based text due to the low resolution, but this is not as much of a problem with modern screens.* 

![Arial is a common sans serif font. Times New Roman is a popular serif font.](https://103705141-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MZnkVRfYQUrftMBZtrD%2F-M_CaAKVwvE9fVlQ42Hn%2F-M_CmgAGkvHQdtm6uRdP%2FCopy%20of%20Copy%20of%20Add%20a%20little%20bit%20of%20body%20text%20\(2\).png?alt=media\&token=9afa10f9-5eb1-4ec4-90fc-26ca82b9d971)

## *References*

[**Body Text*****:***** Four Important Considerations. Practical Typography.**](https://web.archive.org/web/20210414025135/https:/practicaltypography.com/body-text.html)

[**Dyslexia Friendly Style Guide. British Dyslexia Association.**](https://web.archive.org/web/20210428020322/https://www.bdadyslexia.org.uk/advice/employers/creating-a-dyslexia-friendly-workplace/dyslexia-friendly-style-guide)

[**Good Fonts for Dyslexia. Luz Rello and Ricardo Baeza-Yates, Universitat Pompeu Fabra, 2013.**](https://web.archive.org/web/20210414100500/http://dyslexiahelp.umich.edu/sites/default/files/good_fonts_for_dyslexia_study.pdf)

[**Google Fonts. Google.**](https://fonts.google.com/)