Icons

The icon shortcode is used to render icons.

This theme currently uses Lucide Icons for it’s icons. You can find all the icon names in the Lucide Icons List.

Icon usage

Once you find the icon name you need, you must provide it as the default attribute to the icon shortcode. See the examples in the following sections.

Within text

To render the “book-headphones” icon on the end of this sentence :

{{<icon "book-headphones">}}

Or as part of a link to http.cat - :

[http.cat - {{<icon "cat">}}](https://http.cat/)

Edge cases

These test that icons render correctly in contexts where Goldmark’s line-based parsing is sensitive to newlines in shortcode output.

Icon in a heading

Warning
When embedding an icon in a heading, you must use the percentage sign shortcode syntax.
{{% icon "settings" %}}

Settings page

Launch sequence

Icon in a table

Feature Status Icon
Search Done
Upload Pending
Alerts Active

Multiple icons in a heading

Security settings

Icon in bold / italic

This is bold with icon and italic with icon.