The basics

Everything on this page works in presentations, reports and websites alike. Where one kind of document treats something differently, the section says so.

Headings

Start a line with one to six # signs to make a heading: one # is the biggest, six the smallest.

# School trip to the coast

## What to bring

### On the day

What you get: three headings, each smaller than the one before. In a presentation a heading starts a new slide, in a report a # starts a new chapter, and on a website each heading starts a new section of the page.

Bold and italic

Put two stars round words to make them bold, and one star to make them italic.

Bring a **packed lunch** and a *waterproof coat*.

You can also use ~~strike through~~ for something that has changed.

What you get: "packed lunch" in bold, "waterproof coat" in italic, and "strike through" crossed out.

Lists

Start each line with - for a list of points, or with a number and a full stop for a numbered list. Indent a line by two spaces to put it inside the one above.

- Sun cream
- A hat
  - one with a brim is best
- A drink

1. Meet at the school gates at 8:30
2. Coach leaves at 8:45
3. Back by 4:00

What you get: a bulleted list with one point inside another, then a numbered list. The numbers count up for you, so you can reorder the lines freely.

Checklists

Start a list item with [ ] for an empty tick box, or [x] for a ticked one.

- [x] Book the coach
- [x] Send the letter home
- [ ] Collect the consent forms

What you get: a list with tick boxes, the first two ticked.

Put the words to click in square brackets, then the address in round brackets straight after.

Read the [full itinerary](https://example.com/trip) before Friday.

Questions? [Email the office](mailto:office@example.com).

What you get: "full itinerary" and "Email the office" as links. A mailto: address opens the reader's email program.

Pictures

A picture is written like a link with a ! in front. The words in the square brackets describe the picture for people who cannot see it.

![Children rock-pooling on the beach](images/rock-pools.jpg)

What you get: the picture, in the flow of the text. In the editor, Insert puts a picture from your files in for you, with the right path.

Tables

Draw a table with | between the columns and a line of dashes under the headings. A colon on the right of the dashes lines that column up on the right, which suits numbers.

| Activity      | Time  | Cost |
|---------------|-------|-----:|
| Rock-pooling  | 10:00 |   £0 |
| Sea-life centre | 12:30 |  £6 |
| Ice cream     | 3:00  |   £2 |

What you get: a table with a heading row and three rows, the costs lined up on the right. The columns do not need to line up in your text.

Classes

Add {.name} at the end of a heading, paragraph or picture to give it a class. The theme decides what each class looks like. A class needs two letters or more.

# Our summer trip {.cover}

Please read this before Friday. {.lead}

![Map of the bay](images/bay-map.png){.wide}

What you get: the same heading, paragraph and picture, each with a class the theme can style. In a presentation .cover makes a title slide, and in a report .lead makes a larger opening paragraph. You can also give one an id with {#name}, so you can link to it.

Highlight a few words

Put square brackets round some words and a class in curly brackets straight after, to style just those words. This works in presentations and reports.

The coach leaves at [8:45 sharp]{.accent}.

What you get: "8:45 sharp" in its own span, styled by the theme (often in the theme's accent colour).

Blocks

Three colons and a name start a block, and three colons on their own end it. Everything in between is grouped together.

::: callout
Remember: no one swims without an adult.
:::

What you get: the text wrapped in a box with the block's name as its class (here callout). Each kind of document has blocks of its own, such as ::: notes in a presentation or ::: pledges in a report: see the other guides.

To put one block inside another, give the outer block more colons than the inner one, as in :::: card around ::: callout. With the same number of colons, the inner block's end would close the outer one too.

Shapes

A shape block draws a shape with your text centred on it. The first word is the shape: circle, square, triangle, diamond, hexagon, star, star-8, heart, speech, burst, arrow and others. Settings go in curly brackets.

::: shape star-8 {fill=#ffd166 size=40mm}
Free entry!
:::

::: shape arrow e {fill=#118ab2 width=60mm height=24mm}
This way to the beach
:::

What you get: a yellow eight-pointed star saying "Free entry!", and a blue arrow pointing east (to the right) with the words on it. A compass point (n, ne, e, se, s, sw, w, nw) turns the shape, fill sets its colour, and size (or width and height) sets its size.

More