How much top drop should a chapter opening have?

Enough that the title block sits clearly below where a running head would be, which in practice means a drop of roughly a third of the page's head margin plus one or two line boxes. The tool reports the figure in line boxes so it can be related to the body rhythm rather than judged by eye, and a book that uses one drop throughout reads more calmly than one that varies it per chapter.

Why is there no running head on a chapter opening?

Because the chapter title is already on the page. The convention drops the head to give the opening its own space, and the readout states that the head is suppressed on this page. A reference book may keep the head for consistency, which is why the planner treats suppression as a setting rather than a rule.

What is the epigraph for?

It is the quotation or line that sits under a chapter title, set in italic and centred in the pattern that supports it. Only the centred pattern renders it, and it is optional: leaving the field empty simply omits the line rather than leaving a gap. The epigraph belongs to the opening page and is not repeated in the head.

Does the side-aligned number work in a browser?

The exported CSS writes it as a float with a vertical writing mode and a margin, which is a real technique rather than a preview trick. The preview draws it inside a flex row, so the two are close but not identical. Check the exported version in the target renderer before the pattern is committed to a book.

Why does the title size have a pixel readout?

Because the same design often exists as a web reading sample or an EPUB alongside the printed book. Points are the right unit for the page and pixels are the right unit for the screen, and the readout converts at 96 to the inch so the two can be held at the same apparent size. The drop is reported in line boxes for the same reason.

Chapter Header Designer

Chapter opening

Pattern

Chapter numberChapter title

Epigraph / subtitleFace

Titlept

Numberpt

Top droppx

First paragraph

Drop in lines≈ 2.9 line boxes

Title size in px42.7px

Running head on this pagesuppressed (chapter opening)

Preview

Chapter 3

Rhythm

The chapter opening establishes the rhythm the rest of the book inherits: the top margin, the position of the first baseline, and the relationship between the header block and the text.

css output

.chapter-opening {
  font-family: 'Fraunces', serif;
  padding-top: 70px;   /* 4.38rem — the "drop" */
}

.chapter-opening .number {
  font-size: 14pt;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  
}

.chapter-opening h1 {
  font-size: 32pt;
  line-height: 1.1;
  font-weight: 600;
  
}

.chapter-opening .rule { width: 4rem; border-top: 2px solid currentColor; margin: 1.25rem 0; }

You Might Also Need

Drop Cap Generator

Generate elegant drop caps

Initial Cap Styler

Style initial caps

Running Head Planner

Plan running heads

Type Hierarchy Planner

Plan headings and body sizes

The chapter header designer builds the page that opens a chapter, which is the one page in a book with no running head and generous top space. Four patterns cover the conventions in common use, and each one is measured against the text column rather than drawn in isolation.

What is Chapter Header Designer?

The chapter header designer takes a chapter number, a title, an optional epigraph and five settings, then renders the opening page and exports the CSS behind the chosen pattern.

Four patterns are offered: number above title with a rule and then text, a large number alone, a centred title with an epigraph, and a side-aligned vertical number.
Title size runs from 14pt to 72pt, the number from 8pt to 40pt, and the top drop from 0 to 180px.
The face is chosen from the catalogue with mono faces excluded, since the opening page is a display setting rather than a text one.
The top drop is reported both in pixels and in line boxes, dividing by an assumed 24px line box, so the space above the title can be related to the rhythm of the page below it.
The title size is also reported in pixels, using the 96 over 72 point-to-pixel ratio, so the opening can be checked against a screen rendering of the same design.

The top drop is the decision that the rest of the page inherits. It is the distance from the top of the page to the start of the header block, and setting it by eye is what produces an opening page that sits differently from the chapter that follows. Reporting it in line boxes makes the relationship explicit: a drop of seventy pixels is a little under three line boxes at a standard body setting. The side-aligned pattern writes the number as a vertical piece of type with the float cleared to the left and a margin to hold it off the text, which is the modern variant where the number reads as a spine label rather than as a heading. The rule under the header is a short bar rather than a full-measure line, which keeps the block reading as a title rather than as a section divider, and the preview draws every pattern at the same drop so the choices can be compared without re-entering values.

Ornaments, images and initial letters on the opening page are outside the tool, and the drop cap itself is a separate element.
The preview measures the drop from the top of its own container rather than from a page edge, so the head margin of a real page is not applied.
Four patterns are offered and cannot be combined, so a hybrid opening has to be built by editing the exported CSS.
The vertical number in the side pattern is drawn in a flex row in the preview rather than as a floated writing-mode block, so the two are close but not identical.
The title weight is fixed at 600 and the first line of body copy is not aligned to a baseline grid.

Use it when a book's chapter openings are being designed, since the drop and the title scale set the rhythm the whole chapter inherits, and again when an opening page has to be justified against a screen equivalent. Where the head sequence across the book is the question rather than one page, the running head planner covers what each page carries, and where the opening page needs the geometry behind it, the book interior layout preview gives the margins the drop is measured from.

How to use Chapter Header Designer

Choose the pattern, then enter the chapter number, title and epigraph so the block is built from real content.
Pick the face and set the title and number sizes, watching the pixel equivalent readout if the same design also exists on screen.
Adjust the top drop and read the line-box figure, which relates the opening space to the body rhythm below it.
Compare the patterns at the same drop, then copy the generated CSS for the one you keep.

When to use Chapter Header Designer vs related tools

Reach for it when a book's opening pages are being designed and the drop has to be agreed, or when an existing chapter opening feels detached from the text that follows it. It is also the quickest way to compare the traditional number-above-title block against the modern side-aligned number without building both. For the rest of the book's head scheme the running head planner plans the sequence, the drop cap generator handles the first paragraph where one is used, and the book interior layout preview gives the margins the drop is measured against.

Privacy & Security

This tool runs entirely in your browser — no data ever leaves your device. There is no server round-trip, no upload, no logging, and no account required. Your input is processed locally using client-side JavaScript and is never stored, transmitted, or accessible to anyone else. When you close the tab, everything disappears.