markdown.style

Slate — clean product-doc styling for technical reports

Slate is the neutral, engineered look of good product documentation: a modern sans, blue accents, tables that behave. Below is a complete sample report rendered in it.

Use Slate on my markdown Open the exported file

What does the Slate theme look like?

This is a complete sample report rendered in Slate — the exact output the editor downloads, embedded here unmodified.

Quarterly Growth Report

Written by an LLM in seconds — styled by markdown.style.

This is the markdown an AI assistant hands you: solid structure, zero design. The theme you are looking at is doing all of the visual work.

Highlights

Region Revenue Growth
EMEA 4.2M +14%
APAC 3.1M +22%
AMER 6.8M +9%

What drove the quarter

Net growth is computed per region as rate * (1 - churnShare) and rolled up weekly. The pipeline behind it:

export function netGrowth(rates: number[], churn: number[]): number {
  return rates.reduce((sum, r, i) => sum + r * (1 - (churn[i] ?? 0)), 0)
}

Numbers exclude the acquisition closed after the quarter cutoff.[1]

Full methodology lives in the reporting handbook.

  1. See the finance memo for reconciliation details. ↩︎

What does every element look like in Slate?

The same markdown building blocks, one by one: headings, tables, code, quotes, lists, and footnotes, exactly as Slate styles them.

Component specimens

Section headings

A third-level heading

Every inline element gets exercised here: bold text, italic text, a reference link, struck text, and inline code.

Table

Component Kind Notes
Heading Structure h1 through h3
Table Structure GFM pipe syntax
Code Structure fenced block
List Structure ordered and plain

Code block

export function sum(nums: number[]): number {
  return nums.reduce((total, n) => total + n, 0)
}

Blockquote

A quoted aside, set apart from the body copy.

Bullet list

  • First point
  • Second point
  • Third point

Numbered list

  1. First step
  2. Second step
  3. Third step

Task list

Footnote

A claim that needs a source.[1]

Horizontal rule

That covers every building block.

  1. The citation backing that claim. ↩︎

Who is the Slate theme for?

Specs, status updates, PRDs, and technical summaries — the workhorse theme when the document just needs to look professionally handled.

Which themes pair well with it?

  • Carbon — Engineering docs, runbooks, code-heavy AI answers, and anything an engineer reads on screen. The print flip means you never hand someone a black rectangle of toner.
  • Swiss — Strategy memos, design documents, and briefs for readers who notice typography. When in doubt between “more” and “less”, Swiss is the “less”.

Part of the Technical & Docs collection: see the rest of the category.

Browse all themes →

100% in your browser · no upload · free · no sign-up