#Icons

zpress uses Iconify for all icon rendering. Icons are resolved offline at build time — no external requests are made.

#Format

All icon identifiers use the prefix:name pattern:

pixelarticons:book-open
devicon:typescript
simple-icons:react

The prefix selects the icon set, and the name selects the specific icon within that set.

#Supported icon sets

Nine icon collections are bundled and available out of the box:

#Where icons are used

Icons appear in several places across the generated site:

#Sidebar icon rail

Top-level sections display an icon in the collapsed sidebar rail. Set via the icon field on a section entry:

{
  text: 'Guides',
  prefix: '/guides',
  from: 'docs/guides/*.md',
  icon: 'pixelarticons:book-open',
}

Only top-level sections (depth 0) render icons. Nested sections ignore the icon field.

#Navigation bar

When using explicit nav items, each top-level item requires an icon:

nav: [
  { text: 'Guides', link: '/guides', icon: 'pixelarticons:book-open' },
  { text: 'API', link: '/api', icon: 'pixelarticons:terminal' },
]

With nav: 'auto', icons are inherited from the corresponding section.

#Workspace cards

Workspace items (apps, packages, workspaces) display an icon on their home page card and landing page:

apps: [
  {
    text: 'API',
    icon: 'devicon:hono',
    description: 'REST API with typed routes',
    docsPrefix: '/apps/api',
  },
]

#Feature cards

Home page feature cards can display an icon:

features: [
  {
    text: 'Getting Started',
    description: 'Everything you need to set up and start building.',
    link: '/getting-started',
    icon: 'pixelarticons:speed-fast',
  },
]

#Technology tags

Workspace cards display technology tags with auto-resolved icons. See the Technology Tags reference for the full list of supported tag names.

#Validation

Icons are validated at config load time. An icon must:

• Contain exactly one : separator
• Use a recognized prefix (one of the six bundled sets)

Invalid icons produce a config error with type invalid_icon.

#Browsing icons

To find the right icon, browse each set's catalog:

• pixelarticons — pixelarticons.com
• devicon — devicon.dev
• simple-icons — simpleicons.org
• mdi — pictogrammers.com/library/mdi/
• catppuccin — github.com/catppuccin
• skill-icons — skillicons.dev
• logos — github.com/gilbarbara/logos
• vscode-icons — github.com/vscode-icons/vscode-icons
• material-icon-theme — github.com/material-extensions/vsc-material-icon-theme

Or search across all sets on icon-sets.iconify.design.