# Themes

> Pick a built-in theme, adjust colors and fonts, and share definitions across the presentations in a project.

The theme sets the basic look of the presentation: colors, fonts, heading sizes and margins. You pick a built-in theme and adjust whatever you want with definitions at the start of the text.

## Choosing a theme

Use `@theme` at the start of the document, before the first slide. Without `@theme`, the presentation uses the `paper` theme.

```folio
@theme editorial
```

Folio has three built-in themes.

### paper

Cream background, bold headings in Archivo Black, text in Barlow and a coral accent. It is the default theme.

```folio
@theme paper

Annual report {.kicker}
# 2026 results
Revenue, customers and next steps. {.lead}
```

### ink

Dark background, Inter for all text and an amber accent. Good for auditoriums and large screens.

```folio
@theme ink

Annual report {.kicker}
# 2026 results
Revenue, customers and next steps. {.lead}
```

### editorial

Warm light background, serif headings in Fraunces, text in Source Sans 3, a dark red accent and more generous margins.

```folio
@theme editorial

Annual report {.kicker}
# 2026 results
Revenue, customers and next steps. {.lead}
```

The full list of colors and fonts for each theme is in the [Themes reference](/docs/en/reference/themes/).

## Colors

`@color name value` creates a new color or replaces a theme color. The value can be a hex code, another theme color or a color with opacity, such as `coral/80`:

```folio
@theme ink
@color accent #4fd1c5
@color brand #7c5cd6

New product {.kicker}
# Sales dashboard {color=accent}
Launch planned for the second half of the year. {.brand}
```

Replacing `accent` changes every place that uses the highlight color, such as the `.kicker` style. A new color, such as `brand`, can be used in any color attribute (`color=brand`, `bg=brand/20`) and also as a style (`{.brand}`).

Color names use lowercase letters, numbers and hyphens.

## Fonts

`@font name "Family" weights` declares a Google Fonts font. Write the family name in quotes, followed by the weights you will use, from 100 to 900:

```folio
@font title "Bebas Neue" 400
@font body "Inter" 400 700

# Expansion plan {font=title size=5xl}
Three new markets by the end of the year.
```

A new font, such as `title`, is applied with `font=title`. Using a name that already exists replaces the theme font:

| Name | Where it is used |
| --- | --- |
| `body` | Regular text and smaller headings |
| `display` | Main headings and the `.display` and `.huge` styles |
| `mono` | Code |

:::note
Declare only the weights you actually use. Each weight is one more file to load.
:::

## Project theme

The project theme gathers definitions that apply to every presentation in a project. It is the right place for the visual identity of a company, a course or a client.

To edit it, hover over the project in the sidebar and click the palette icon, **Project theme**. The editor shows a **Preview with the theme**, and changes are saved automatically.

```folio
@theme editorial
@color brand #1e83d6
@font title "Bebas Neue" 400
@style label {size=sm weight=bold uppercase tracking=0.14 color=brand}
```

Project theme rules:

- It can only contain definitions: `@theme`, `@color`, `@font`, `@style` and `@component`. Slides in the project theme are an error.
- `@title` and `@author` are ignored there, because they belong to each presentation. The editor shows a warning.
- Each presentation can override anything it wants: its own `@theme`, a color, a font, a style or a component with the same name.
- Errors in the project theme only show up in the theme editor, never in the presentations.

:::caution
The project theme has no conflict control. If it is open in two tabs at the same time, the last saved change wins.
:::

## Next steps

- [Styling](/docs/en/guides/styling/): use the theme's colors and fonts on your slides.
- [Components](/docs/en/guides/components/): put components in the project theme to reuse them in every presentation.
- [Themes reference](/docs/en/reference/themes/): every color, font and size for each theme.
