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.
section
Triggered by: an H2 heading with no body content.
Coloured section-break slide for dividing a presentation into chapters.
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.
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

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.
quote
Triggered by: a single blockquote with no heading.
Large centred quote with optional attribution in smaller text.
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.
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.
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.
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