Icons

Adding Icons

Tiramisu Docs uses Iconify for icons, giving you access to over 275,000 icons from 150+ icon sets. Icons are loaded on demand — no build-time bundling needed.

Icon Format

Icons use the prefix:name format from Iconify:

Section Icons

Add an icon field to your section config in tiramisu.config.ts:

sections: [
  { label: "Guide", path: "guide", icon: "lucide:book-open" },
  { label: "API", path: "api", icon: "lucide:code" },
]

Section icons appear in the top bar next to the section label.

Page and Group Icons

Add icon to the meta block of any .tiramisu file:

meta { title = Getting Started, order = 1, icon = lucide:rocket }

For folder index pages (index.tiramisu), the icon is applied to the sidebar group or subgroup heading. For regular pages, the icon appears next to the page title in the sidebar and in the page header.

Page Header

When viewing a documentation page, the page header displays:

• The parent group or subgroup name as a small label above the title
• The page icon (if set) next to the title
• The page title and description from meta

Browsing Icons

Use the Iconify Icon Sets browser to find icons. Some popular sets:

Code Block Icons

Code blocks and tabbed code blocks automatically detect language icons using the devicon-plain set. You can override the auto-detected icon:

codeblock { language = typescript, icon = "lucide:file-code", """const x = 1""" }