Markdown elements

Headings

The engine adds anchor links to headings on hover (try it), and the heading above this text uses an id from its title. Sub-headings nest in order:

Third level heading

Fourth level heading

Text

This is a paragraph with bold, italic, both, strikethrough, and inline code that wraps long identifiers like REALLY_LONG_FUNCTION_NAME_that_should_never_overflow_the_line when needed. Links look like this one, with a subtle underline that brightens on hover. Pressing Ctrl + K does nothing here, but the keys render nicely.

Lists

• unordered item one
• unordered item two
  • nested item
  • another nested item
• unordered item three

1. ordered item one
2. ordered item two
3. ordered item three

Task lists use checkboxes:

• write the docs
• render them with Stygian
• ship it

Quotes

A plain blockquote. It keeps the reading rhythm without shouting.

And callouts, via a kramdown attribute list on the blockquote:

Note: this is a callout. Write the note text inside the quote and add {: .callout } on the next line.

Warning: callouts inherit the theme surface and glow color, so they stay legible in both light and dark mode.

Code

Inline code uses the mono stack with a bordered chip. Fenced blocks get a copy button (hover the block) and a terminal-style surface:

gem build stygian.gemspec
jekyll build --baseurl /stygian
python3 -m http.server 4000 --directory _site

collections:
  docs:
    output: true
    permalink: /:collection/:path/
defaults:
  - scope:
      path: ""
      type: docs
    values:
      layout: docs

document.querySelectorAll('.sty-prose table').forEach((table) => {
  const wrap = document.createElement('div');
  wrap.className = 'table-scroll';
  table.parentNode.insertBefore(wrap, table);
  wrap.appendChild(table);
});

- remote_theme: just-the-docs/just-the-docs
+ remote_theme: ksauraj/stygian

Tables

Plain markdown tables render on a bordered surface. Narrow screens scroll the table horizontally instead of breaking the layout:

Code inside table cells stays on one line: kubectl get pods -o wide.

Diagrams

Mermaid fences load the library lazily and render on demand. The theme keeps a dark graph in dark mode and a neutral one in light mode:

flowchart LR
    A[Markdown page] --> B[Kramdown]
    B --> C[Sidebar entry]
    B --> D[Prose render]
    D --> E[Copy buttons]
    D --> F[Tables]
    D --> G[Mermaid]
    C --> H[Prev / next]

Horizontal rule

Footnotes

Kramdown footnotes render at the bottom of the page¹.