[Jeff Wu](/)

# Mermaid diagram test

A small test of diagrams in the publishing pipeline.

This test article checks that a diagram can travel from an MDX file through
the site build and into a readable page. The diagram below should appear in
the site's teal palette with DM Sans labels, even when JavaScript is disabled.

<figure className="diagram">

```mermaid
flowchart TD
    accTitle: From article to diagram
    accDescr: An MDX article is compiled during the site build into an SVG diagram, which is displayed on the article page.
    A[MDX article] --> B[Site build]
    B --> C[SVG diagram]
    C --> D[Article page]
```

<figcaption>The build produces the diagram before a reader opens the page.</figcaption>
</figure>

## What this checks

The four boxes should connect from top to bottom without clipped labels or
horizontal scrolling on a phone. The text explanation and caption describe the
same process without relying on color.

This is temporary test content for validating the publishing pipeline.

[← Back to overview](/)