> For the complete documentation index, see [llms.txt](https://docs.maker.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.maker.co/maker-pages/account-and-faq/basic-typography-rules-for-the-web.md).

# Basic typography rules for the web

Following are a handful of typography guidelines for your Maker story:

### Select a font: Serif vs. San Serif fonts

Serifs are the tiny strokes at the end of a letter’s main strokes. Serif fonts have these extra strokes; sans serif fonts do not. (Sans is French for “without.”) Serif fonts also vary the thickness of the letter strokes more than sans serifs, which have more uniform lines. When selecting a font for the story, keep in mind that san serif fonts are much easier to read, therefore, we recommend those for the body of your Maker story. Serif fonts can be used for headings and hence create a good balance and visual delight.

TEXT

serifs

Serif font

San Serif font

### Select a font size

Start with your body text and choose a font size for your desktop between 15-25px. Reading a larger body text size is much easier and puts less strain on the eye of the user.

#### Font size 12px

Diam in arcu cursus euismod quis viverra nibh cras pulvinar. Tellus in metus vulputate eu scelerisque felis imperdiet proin. Feugiat scelerisque varius morbi enim.

#### Font size 15px

Start typing here...

### Font size for headings

The font size of your H1 should be 1.8-2x the size of your body font. If you have an H2, the font size should be 1.3-1.5x of your body font.

#### H1 Font size of 18px

Auctor elit sed

#### H1 Font size of 28px

### Set the line height

Lack of white space between lines makes text hard to read. As a rule, line height of 1.2-1.5x is recommenced.

#### Line height of 14px (1.1x)

#### Line height of 23px (1.5x)

### Add proper white space between headers and body text

Negative space between headings and body should feel open yet, tight enough to signal a relationship between the body and headers. The total margin between headers and body should be 30px, 20px and 15px.

#### Margin 30px

#### Margin 20px

#### Margin 15px

## Header 1

### Header 2

#### Header 3

### Line length

The line length for a single column text block should be around 45-90 characters or 500-700px wide. Any more than this and the readers will feel overwhelmed.

#### Line length of 700px

Tortor id aliquet lectus proin. Aliquet eget sit amet tellus cras. Eget nulla facilisi etiam dignissim diam. Ante in nibh mauris cursus.Tortor id aliquet lectus proin. Aliquet eget sit amet tellus cras. Eget nulla facilisi etiam dignissim diam. Ante in nibh mauris cursus.Tortor id aliquet lectus proin. Aliquet eget sit amet tellus cras. Eget nulla facilisi etiam dignissim diam. Ante in nibh mauris cursus.

#### Line length of 1000px

Tortor id aliquet lectus proin. Aliquet eget sit amet tellus cras. Eget nulla facilisi etiam dignissim diam. Ante in nibh mauris cursus.Tortor id aliquet lectus proin. Aliquet eget sit amet tellus cras. Eget nulla facilisi etiam dignissim diam. Ante in nibh mauris cursus.Tortor id aliquet lectus proin. Aliquet eget sit amet tellus cras. Eget nulla facilisi etiam dignissim diam. Ante in nibh mauris cursus.ine length of 700px. Tortor id aliquet lectus proin. Aliquet eget sit amet tellus cras. Eget nulla facilisi etiam dignissim diam. Ante in nibh mauris cursus.Tortor id aliquet lectus proin.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.maker.co/maker-pages/account-and-faq/basic-typography-rules-for-the-web.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.