# Quickstart

> Write your first slide and present it in five minutes.

This guide takes you from your first login to a full-screen presentation. There is nothing to install: Folio runs in the browser.

## 1. Pick a template

The first time you log in, Folio shows the template gallery. Each template creates a project with its own look and sample slides for you to replace with your content:

| Template | For |
| --- | --- |
| **Blank** | Starting from scratch |
| **Folio tour** | Two presentations that show everything the language can do |
| **Pitch** | Investors and sales |
| **Results** | A quarterly or monthly report |
| **Business proposal** | Sending to a client |
| **Class / Workshop** | Teaching a topic |
| **Roadmap** | Quarterly planning |
| **Weekly status** | A quick weekly meeting |

Click a template to see all its slides, adjust the project name and click **Use this template**. To see the editor in action, start with the **Folio tour**.

To create more projects later, use the new project button next to **Projects** in the sidebar: it opens the same gallery.

## 2. Get to know the editor

The screen has three areas:

| Area | What it is for |
| --- | --- |
| Sidebar | Projects and presentations. Hover over a project to create, rename or delete. |
| Editor | The presentation text. Errors are underlined, with the explanation in the bottom panel. |
| Preview | The slide where the cursor is. Thumbnails of every slide sit below it. |

Everything is saved automatically. The indicator at the top of the editor shows **Saved** when nothing is pending.

## 3. Write your first slide

Clear a presentation and write:

```folio
@title My first presentation

# Hello, world
This is my first slide.

---
# Second slide
- A `---` on its own line starts a new slide
- Each line of text becomes a line on the slide
```

The preview updates as you type. Click any element in the preview to move the cursor to its line.

## 4. Add a visual touch

Attributes in braces at the end of a line change how a block looks:

```folio
--- {align=center}
# Hello, world {size=5xl color=accent}
This is my first slide. {.lead}
```

`--- {align=center}` centers the slide, `size` and `color` adjust the heading and `.lead` applies a ready-made style for highlighted text.

:::tip
At the start of a line, type `/` to see ready-made templates such as `/cards` and `/text-and-image`. After `:::`, the editor suggests the available blocks.
:::

## 5. Present

- **Present** opens the presentation in full screen. Use the arrow keys to move forward and **Esc** to exit.
- **Presenter** opens a view with notes, the next slide and a timer, and lets you open the audience screen in another window.

## Next steps

- [Writing slides](/docs/en/guides/writing/): text, lists, images and tables.
- [Layout](/docs/en/guides/layout/): columns, grids and alignment.
- [Styling](/docs/en/guides/styling/): colors, sizes, fonts and reusable styles.