Example Post: Formula, Code, Prose

This post exists to show what the content pipeline can do. Delete or replace it once the journal has real posts.

Prose

Regular paragraphs render in Source Serif 4. Inline things like variable names, emphasis, and strong work as expected. Links are underlined in vermillion and carry a hover state.

Lists work too:

• Short bullets stay tight.
• Numbered lists keep a serif rhythm.
• Nested items inherit the same baseline.

Math

Inline math renders with KaTeX: the softmax over logits $z_i$ is $\sigma(z)_i = e^{z_i} / \sum_j e^{z_j}$. Block math gets its own line:

where $\tau$ is the distillation temperature, $z_t$ the teacher logits, and $z_s$ the student logits. Larger $\tau$ softens the distribution and surfaces more dark knowledge.

Code

Syntax highlighting runs on Shiki’s github-dark-dimmed theme. A Python snippet:

import torch
import torch.nn.functional as F

def distillation_loss(student_logits, teacher_logits, temperature=4.0):
    soft_targets = F.log_softmax(teacher_logits / temperature, dim=-1)
    soft_preds = F.log_softmax(student_logits / temperature, dim=-1)
    return F.kl_div(soft_preds, soft_targets, reduction="batchmean", log_target=True) * (temperature ** 2)

A TypeScript snippet on the same page:

type Temperature = number & { __brand: "temperature" };

const asTemperature = (n: number): Temperature => {
  if (n <= 0) throw new Error("temperature must be positive");
  return n as Temperature;
};

And a shell one-liner:

pnpm build && pnpm preview

Callouts

Use the FormulaInset component when you want a boxed-off derivation:

(The import is commented out here so the post stays self-contained. Uncomment when you need it.)

What this tells you

If math renders, code highlights, links are underlined in vermillion, and the layout stays inside a 680-pixel column with that slim slab of reading space on either side — the pipeline is healthy. Replace this post.