Keyboard shortcuts

Press ← or → to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

Ornaments & Layout

Ornament is not decoration added to a page; it is the page confessing what it cares about. The Style Codex, on itself 
<div class="epigraph">
The quotation, set in italics above the chapter.
<span class="attribution">Who said it</span>
</div>

Every device in this chapter is opt-in: a plain Markdown file stays plain, and a decorated page declares its intent in raw HTML. This opening paragraph summons a drop cap with class="initial" — the automatic drop cap only follows a chapter title, so use this one mid-book.

<p class="initial">A manual drop cap, for paragraphs that do not follow a title.</p>

Highlights & Tags

Use a gilded highlight when the reader must not skim past a phrase — sparingly, or the gold turns to noise. Tags mark status inline without breaking the sentence: this chapter is codex, its theme is verified, the print run is scheduled, and nothing here is blocked.

<mark>a gilded highlight</mark>

<span class="tag">codex</span>
<span class="tag green">verified</span>
<span class="tag blue">scheduled</span>
<span class="tag red">blocked</span>

A Timeline

A timeline sets a chronology on a golden spine, with a bold lead-in per entry:

  • 2022 — the first book is bound: plain styles, plain pages, offline from day one.
  • 2024 — the slide compiler is written in Go; decks join the library.
  • 2026 — the Style Codex opens, and the spec system takes over fonts and colors.
<ul class="timeline">
<li><strong>2022</strong> — what happened that year.</li>
<li><strong>2024</strong> — and then this.</li>
</ul>

Two Columns

Long front matter, indexes, and glossaries read better in two columns: the eye travels a shorter line, and dense reference prose stops feeling like a wall. The column rule is a hairline in the accent wash, quiet enough to ignore.

On narrow screens the columns collapse back into one, so this device costs nothing on a phone. In print both columns are kept, which is where they earn their keep — paper is wide and patience is short.

<div class="twocol">

First paragraph. Blank lines keep the Markdown inside working.

Second paragraph.

</div>

The End of a Chapter

A chapter that has said everything should say so. The finis mark below closes the chapter the way a colophon closes a book — reserve it for true endings, not section breaks (those get the fleuron rule).

❦ ❦ ❦

<p class="finis">❦ ❦ ❦</p>