Skip to content

Layouts

Kova automatically selects the best layout for each slide based on its content. You can also override the layout manually with an HTML comment.


Automatic layout detection

Kova analyses the elements on a slide and applies the first matching rule in priority order:

Priority Condition Layout applied
1 H1 heading title
2 Any !youtube or !poll element media
3 Two \|\|\| column breaks three-column
4 A single \|\|\| column break two-column
5 A lone !video (the slide's only element) media
6 All elements are code blocks or Mermaid diagrams code
7 All elements are display-math blocks ($$...$$) math
8 No heading + single image full-bleed
9 No heading + single blockquote quote
10 No heading + no body content blank
11 H2 + no body content section
12 Heading + single image only title-image
13 Heading + one image + one text block split
14 2–3 logical elements, visually diverse bsp
15 4 or more logical elements grid
16 Dense pure-text exceeding overflow threshold two-column
17 Anything else title-content

Logical element counting

Consecutive !progress bars are treated as a single logical unit for the BSP and Grid threshold checks. A slide with a heading, a paragraph, and four progress bars is counted as 3 logical elements — not 6 — so it uses bsp rather than grid.

Overflow guard

Text-only slides that exceed the safe area line count automatically fall back to two-column to prevent text clipping (rule 16).

Rescaled to fit

If a slide's content still exceeds the available space after layout selection, Kova scales it down to fit. A "rescaled to fit" badge appears in the bottom-right corner of the preview to let you know. Consider splitting the slide or reducing content if you see this badge.


Layout reference

title

Triggered by: an H1 heading.

Full-colour hero slide. Paragraphs below the H1 render as subtitles. Background colour, text alignment, and decorative pattern follow the active theme.

# Kova

The presentation tool for people who prefer to write.

section

Triggered by: an H2 heading with no body content.

Coloured section-break slide for dividing a presentation into chapters.

## Part Two: Results

title-content

Triggered by: a heading with text, lists, tables, or other body content.

This is the default layout. The heading sits across the top; content fills the remainder of the slide.

## Key findings

- Response time improved by 40%
- Error rate dropped below 0.1%
- Customer satisfaction up 18 points

title-image

Triggered by: a heading with a single image and nothing else.

The heading anchors the left side; the image fills the right half.

## Architecture overview

![System diagram](./diagram.png)

split

Triggered by: a heading + one image + one text block (paragraph or list).

Image on the left, text on the right. Good for product screenshots with accompanying description.

## The editor

![Screenshot](./editor.png)

Write slides in plain Markdown with a live preview alongside.

full-bleed

Triggered by: a single image with no heading.

The image fills the entire slide (cover crop). Good for dramatic opening or closing slides.

![Conference hall](./crowd.jpg)

quote

Triggered by: a single blockquote with no heading.

Large centred quote with optional attribution in smaller text.

> The best way to predict the future is to invent it.
> — Alan Kay

blank

Triggered by: no heading and no body content — a slide left (deliberately or accidentally) empty.

Renders nothing but the theme's background colour — no placeholder text, no empty boxes. Useful as an intentional pause slide between sections. A blank slide still shows the theme's header/footer bar and logo if those are enabled, and exports the same way — a plain background-coloured slide, in both PDF and PowerPoint.

<!-- Pause here for questions -->

An empty slide alone doesn't count

Two --- separators with nothing but blank lines between them collapse into nothing — Kova doesn't create a slide there at all. A slide needs some non-whitespace content to exist, even if that content (like the comment above) renders as nothing. An ordinary HTML comment works well for this, since Kova only treats specific comment forms (<!-- layout: ... -->, <!-- color: ... -->, <!-- hidden -->, and a few others) as directives — anything else is silently dropped from the rendered slide.

A background image beats blank

Adding a ![bg] line to an otherwise-empty, untitled slide produces full-bleed instead of blank — the background image always wins.


two-column

Triggered by: a ||| column break, or the overflow guard on a dense pure-text slide.

Splits the slide into two equal columns. If ||| is present the split occurs there; otherwise Kova splits at the element midpoint. A !toc list long enough to overflow the slide splits the same way, balancing entries across both columns by title length.

## Before and after

**Legacy workflow**

1. Open PowerPoint
2. Drag text boxes around
3. Fight with alignment

|||

**With Kova**

1. Write Markdown
2. Choose a theme
3. Click Present

three-column

Triggered by: two ||| column breaks on the same slide.

Splits the slide into three equal columns, one per |||-separated block. Extends the same syntax as two-column — a third block just needs a second separator instead of folding into the right-hand column.

## Pricing tiers

**Free**

- Unlimited presentations
- All themes

|||

**Pro**

- Priority support
- Team library

|||

**Enterprise**

- SSO
- Custom deployment

bsp

Triggered by: 2–3 logical elements where the mix is visually diverse.

  • 2 elements: side-by-side panes.
  • 3 elements: left column + stacked right column.

Text content is placed on the left; visual content (images, progress bars, Mermaid) goes on the right. Consecutive !progress bars are grouped into a single pane.

## Team health

We're making solid progress across all workstreams.

!progress[Feature delivery](88)
!progress[Code review SLA](72)
!progress[Test coverage](91)

code

Triggered by: all body elements are code blocks or Mermaid diagrams.

Dark, code-focused background with a full-width monospace display. Optimised for code reviews and technical walkthroughs.

## Parsing a slide

```rust
fn parse_slide(src: &str) -> Slide {
    let tokens = tokenise(src);
    layout::detect(&tokens)
}
```

math

Triggered by: every body element is a display math block ($$...$$) — one or more, with or without a heading.

Stacks the equations vertically, each centred and scaled up for readability. Only counts standalone $$...$$ blocks; inline math ($...$) inside a paragraph doesn't count as a body element on its own, so a slide mixing prose and inline math uses the normal layout rules instead. A $$...$$ block paired with text-like content (a paragraph, list, blockquote, or ToC) is deliberately excluded here too — it stacks full-width in whichever layout that content would otherwise get, rather than being squeezed into a narrow BSP pane. See Markdown & Syntax — Math & LaTeX.

## The core identity

$$
e^{i\pi} + 1 = 0
$$

PowerPoint export

PDF export reproduces the rendered equation exactly, like any other slide. PowerPoint export is a current limitation: the raw LaTeX source (e^{i\pi} + 1 = 0) is exported as monospaced text rather than a rendered equation, since PptxGenJS has no LaTeX rendering of its own.


media

Triggered by: a !youtube or !poll element, or a !video that is the slide's only element.

Centred media display with the title above. Ideal for embedding polls or videos mid-presentation.

## Quick poll

!poll[Which layout do you use most?](https://pollev.com/my-poll)

A !video sharing the slide with other content is not forced into media — it flows through the normal auto-layout rules instead, the same as an image. See Markdown & Syntax — Local video.


grid

Triggered by: 4 or more logical elements.

Elements are arranged in a responsive grid of cards. Good for feature comparisons or category overviews.

## Supported platforms

- **macOS** — Universal binary, Apple Silicon and Intel
- **Windows** — MSI and setup.exe installers
- **Debian/Ubuntu**`.deb` package
- **Fedora/RHEL**`.rpm` package
- **AppImage** — distro-independent

Manual override

Place <!-- layout:NAME --> at the very top of a slide to force any layout regardless of content:

<!-- layout:grid -->

## Pricing tiers

- **Free** — unlimited presentations, all themes
- **Pro** — priority support (coming soon)
- **Team** — shared theme library (coming soon)
- **Enterprise** — custom deployment (coming soon)

Available names: title · section · title-content · title-image · split · full-bleed · quote · blank · two-column · three-column · bsp · grid · media · code · math