> For the complete documentation index, see [llms.txt](https://docs.strm.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.strm.design/reference/sections/timeline.md).

# Timeline

Steps or milestones that fill in on scroll, or a simple list.

Steps or milestones that fill in on scroll, or a simple list.

**Where:** Any template (Add section)\
**File:** `sections/timeline.liquid`

![Timeline](https://2073252647-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX7okZwFVjG38blUMwqg%2Fuploads%2Fgit-blob-77a6bfcb7e8ed18a0de62680fd51922603443cf1%2Ftimeline.png?alt=media)

## Section settings

| Setting            | Type                       | Options                                   | Default                      | Notes |
| ------------------ | -------------------------- | ----------------------------------------- | ---------------------------- | ----- |
| **Eyebrow**        | Text                       |                                           |                              |       |
| **Heading**        | Text (bold, italic, links) |                                           | How it works                 |       |
| **Layout**         | Choice                     | Steps that fill in on scroll, Simple list | Steps that fill in on scroll |       |
| **Color scheme**   | Color scheme               |                                           | Scheme 1                     |       |
| **Top padding**    | Slider                     | 0–160px, steps of 4                       | 48px                         |       |
| **Bottom padding** | Slider                     | 0–160px, steps of 4                       | 48px                         |       |

## Blocks

### Timeline step block

One step or milestone in a timeline.

| Setting        | Type      | Options | Default                                  | Notes |
| -------------- | --------- | ------- | ---------------------------------------- | ----- |
| **Time label** | Text      |         | Step                                     |       |
| **Heading**    | Text      |         | What happens                             |       |
| **Text**       | Rich text |         | Describe this step in a sentence or two. |       |

## Presets

Add it from **Add section** as: **Timeline**, **History**.