---
title: "Docs"
description: "The reference a product ships."
canonical: docs.html
navigation-title: "Docs"
---

<a id="docs"></a>

# Docs

- [The documentation surface](#the-documentation-surface)
- [The guideline](#the-guideline)
- [An article](#an-article)
- [The reading page](#the-reading-page)
- [The questions](#the-questions)
- [The tool reference](#the-tool-reference)

The reference a product ships. A page here reports: a column of text with
what a text needs, and the way through the set beside it.

<a id="the-documentation-surface"></a>

## The documentation surface

The one place where the documentation *is* the product presentation. A
visitor gets the pitch and scrolls into the reference without a seam. 210px
tool rail, a 1200px page measure, 48px gutters.

[Documentation · 1440x900](../../../_cards/screens/documentation.html)

<a id="the-guideline"></a>

## The guideline

What a construction rule looks like on a page. The values a drawing has to
hold, the palette it can use, and the two grounds it has to survive.
Everything here is a fact somebody checks their own work against, so
nothing is prose that can be a number. No ground, no colour and no size
stands typed into the page. A guideline that hardcodes what it documents
stops being true the day the system moves.

[Guide · 1440x900](../../../_cards/screens/guide.html)

<a id="an-article"></a>

## An article

One column of text with what a text needs in it: a drawing, a borrowed
sentence, a block the machine wrote. Its contents stand beside it as
`sds-nav-rail`, because a table of contents is a list of links beside a
column.

[Article · 1440x900](../../../_cards/screens/article.html)

<a id="the-reading-page"></a>

## The reading page

The page that shows its own measure. Every other page is an archetype of
something a product needs; this one is the reference for the rhythm they
all follow. The registers stand under each other in one column, and each
block with a title stands beside one without. It holds one of everything,
because it is what `make baseline` and `make diff` read as the rhythm's
record.

[Reading · 1440x900](../../../_cards/screens/reading.html)

<a id="the-questions"></a>

## The questions

A list of questions, not a wall of answers. `sds-accordion` is a real
`<details>`, so the fold works before a script runs and find-in-page opens
the answer it lands in.

[Questions · 1440x900](../../../_cards/screens/questions.html)

<a id="the-tool-reference"></a>

## The tool reference

The full tool surface at compact density: the least room a row reads in. Here
the list *is* the work, and a scan beats a read.

[Tool reference · 1440x900](../../../_cards/screens/tool-reference.html)