coppice

A tour of coppice

Mon, 19 Oct 2026 00:00:00 +0000

This post is a sampler. Each section below shows one thing a coppice site can do, working, rather than describing it; Writing with coppice has the syntax behind each. Because the post has several sections, it has a contents list, unless contents is turned off in config.toml: on a wide screen it is the sidebar on the left, marking the section you are reading, and on a narrow one it is the list above.

Notes in the margin

Long asides interrupt an argument, and footnotes make readers jump to the bottom of the page and back. Sidenotes sit beside the line they belong to instead. (This is a sidenote. On a wide screen it sits in the right margin, level with its number; on a narrow one, tap the number to open it under the line.) They are numbered in order through the post. (The second one. Notes can hold markdown, and links too.) A margin note is the same without a number, for a remark rather than a reference. (A margin note: on a narrow screen it opens from the ⊕.)

In the feed, which has no margins, each note follows its line in parentheses, so nothing is lost there either.

Type

Text is set in one column, with italics, bold, ~~struck-out words~~, inline code and links. Headings come in three levels below the title.

A third-level heading

And a fourth

A quotation stands apart, in italics, with a rule down its left side, and its source underneath.

the stylesheet, describing itself

Tip

A callout sets a note, a tip or a warning apart from the text. It's a quotation that starts with [!TIP], as on GitHub.

Lists come numbered, bulleted or ticked:

Write in markdown.
Run go run ..
Upload public/.

sidenotes
galleries
a newsletter

Tables

Tables take the column's width, with figures lined up. These are the thirteen animations the home page can show, set by animation in config.toml:

animation	what it draws
`shapes`	ASCII solids that melt into each other: a donut, a cube, a Menger sponge
`curve`	Lissajous figures and rose curves, one line throughout
`cycloid`	a circle rolling round another: cardioid, nephroid, astroid
`cycloid-horizontal`	a circle rolling along a line: normal, curtate and prolate cycloids
`medley`	`curve`, `cycloid` and `cycloid-horizontal` as one
`mandelbrot`	one line closing in on the Mandelbrot set's boundary
`ford`	Ford circles over the fractions from 0 to 1
`golden`	a line that curls into the golden spiral and back
`nautilus`	a nautilus shell in section, its chambers growing in
`sine`	a pen bobbing up and down, its height drawn out as a sine wave
`penrose`	the impossible triangle, turning for ever
`chords`	chords round a circle, their envelope a cardioid, then a nephroid
`newton`	Newton's cradle

On a narrow screen a table too wide for it scrolls sideways.

Code

Code is highlighted when the site is built, so readers download no highlighter, and each block has a button to copy it. The ratio of neighbouring Fibonacci numbers closes in on the golden ratio, the one the golden animation curls into:

package main

import (
	"fmt"
	"math"
)

func main() {
	a, b := 1.0, 1.0
	for range 20 {
		a, b = b, a+b
	}
	fmt.Printf("F(22)/F(21) = %.10f\n", b/a)
	fmt.Printf("φ           = %.10f\n", (1+math.Sqrt(5))/2)
}

It prints 1.6180339850 and 1.6180339887: twenty steps get eight decimal places right. The ford animation draws one circle for every fraction between 0 and 1 whose denominator is at most 20:

from math import gcd

fractions = [(p, q) for q in range(1, 21) for p in range(q + 1) if gcd(p, q) == 1]
print(len(fractions), "circles")
print("smallest radius:", 1 / (2 * 20**2))

It finds 129 circles, the smallest of radius 0.00125, when the two largest have radius ½.

Mathematics

Equations are MathML, drawn by the browser itself, with no script and no pictures of formulae. The circle over the fraction p/q has radius 1/(2q²), and two of them touch exactly when the fractions are neighbours:

| p s - q r | = 1

for circles over p/q and r/s. And the sum Euler found in 1734:

\sum_{n = 1}^{\infty} \frac{1}{n^{2}} = \frac{π^{2}}{6}

Pictures

A picture can carry a caption, set in a smaller, quieter type:

Katsushika Hokusai, Under the Wave off Kanagawa, about 1830–32. The Metropolitan Museum of Art, public domain.

A gallery

A gallery works in a post as it does on a page: tiles in a grid, each opening larger over the page, with the arrow keys and Esc to move through them. These are six of the home page's animations, recorded as GIFs, in a gallery of columns, which shows each picture whole:

ford

golden

newton

nautilus

cycloid-horizontal

mandelbrot

The gallery page has a hundred and eighteen paintings and prints, from van Eyck to Malevich.

Colours and type

Everything here follows config.toml. Ten colour themes, each with a light and a dark side that follow the reader's system: paper, Catppuccin, Gruvbox, Solarized, Nord, Rosé Pine, Tokyo Night, Everforest, Dracula and clrs. Ten styles for code, paired the same way. Any two fonts from Google Fonts, which the build downloads so that readers never contact Google; by default Atkinson Hyperlegible, drawn for readers with low vision. The site's own words in lowercase, as typed, in capitals or in small capitals. And a size for every kind of text, from this paragraph to the captions.

Writing with coppice

Sun, 11 Aug 2024 00:00:00 +0000

A post is a markdown file in content/posts/, and its file name is its address: this one is content/posts/writing.md, published at /posts/writing/. It's an example, to read and delete; writing in the docs has the syntax for everything here, and the tour shows all of it at once.

The top of the file

Every post starts with its front matter, a few lines between --- lines:

---
title: Writing with coppice
description: A line under the title, also for search engines and the feed.
date: 11-08-2024
---

The date is day, month and year. A post dated after today waits until a build on or after that day, and one with draft: true waits until you take the line out.

Asides

An aside that would interrupt the argument goes in the margin instead, as in Edward Tufte's books. (Like this one: {sn|…</span> in the text, a number here, and the note beside its line on a wide screen.} On a phone, the number opens it under the line.

Note

A callout is for what the reader mustn't miss, rather than what they might enjoy: > [!NOTE] at the start of a quotation.

Code

Fenced code is highlighted when the site is built, and copied with the button that appears when it's pointed at:

fmt).Println("hello")

The rest, from pictures and galleries to mathematics, is in the docs.

Getting started with coppice

Tue, 23 Jul 2024 00:00:00 +0000

coppice turns a folder of markdown into a small personal site: a home page with an animation, posts with sidenotes, a list of writings, pages, galleries, docs and a feed. This post is an example, to read and then delete; the docs are where the details live, and this is the short way through them.

Four steps

Build it. With Go installed, clone the repository and run go run . -serve :8000. The site is at localhost:8000, and builds again whenever you save a file. Getting started has the rest.
Make it yours. Every setting is in config.toml, with a comment saying what it does: the site's name and address, the links on the home page, the animation, the colours and the fonts. Settings goes through each.
Write. A post is a markdown file in content/posts/, with a title and a date at its top. Pages, posts and docs says what goes where, and writing what can go inside.
Publish. public/ is the whole site, ready for any static host, or for one that builds it from git on every push. Deploying shows how.

When something's wrong

coppice would rather stop than build a broken site. A typo in a setting, a post without a date, a link to a page that isn't there: the build names the file and the problem, and with -serve the last good site stays up while you fix it. (A picture without a description doesn't stop it, but it's reported, so you can describe it for those who can't see it.)