Headings
Six heading levels — H1 through H6 — each rendered as a native semantic HTML element via a custom Tiptap SemanticBlock extension. Headings are automatically picked up by the Table of Contents block and the right-side TOC in documentation pages.
Markdown shortcuts
| Type this | Converts to |
|---|---|
| # | Heading 1 |
| ## | Heading 2 |
| ### | Heading 3 |
Heading levels
| Level | Slash command | Default style |
|---|---|---|
| H1 | /heading1 or /h1 | 2.25rem · bold · tight tracking |
| H2 | /heading2 or /h2 | 1.875rem · bold · tight tracking |
| H3 | /heading3 or /h3 | 1.5rem · semibold |
| H4 | /heading4 or /h4 | 1.25rem · semibold |
| H5 | /heading5 or /h5 | 1.125rem · semibold |
| H6 | /heading6 or /h6 | 1rem · semibold · muted color |
Semantic HTML
Each heading level renders as its corresponding HTML element (<h1>through <h6>) on both the editor canvas and the published page. This is important for accessibility and SEO — screen readers and search engines read the heading hierarchy correctly.
Converting between levels
Type / inside any heading to open the slash command palette and switch to a different level. You can also use the block type menu (right-click the drag handle) to convert between all block types without losing content.
Table of Contents integration
H1, H2, and H3 blocks are extracted by the TOC block and the documentation right-side TOC. The TOC assigns each heading a stable id slug derived from its text content (lowercased, spaces replaced with hyphens). Duplicate headings get a numeric suffix (-2, -3, etc.).
Toggle headings
H1, H2, and H3 have collapsible variants — Toggle Heading 1, Toggle Heading 2, Toggle Heading 3. These behave identically to regular headings but add a chevron that shows or hides child blocks. See the Toggle page.