CommonMark

If your app renders Markdown (a blog, a wiki, a CMS), this extension lets content authors embed icons directly in their writing. No PHP, no template tags, just a short inline syntax.

This is a separate package:

composer require frostybee/swarm-icons-commonmark

Wire it up

use Frostybee\SwarmIcons\CommonMark\IconExtension;
use League\CommonMark\Environment\Environment;
use League\CommonMark\Extension\CommonMark\CommonMarkCoreExtension;
use League\CommonMark\MarkdownConverter;

$environment = new Environment();
$environment->addExtension(new CommonMarkCoreExtension());
$environment->addExtension(new IconExtension($manager));

$converter = new MarkdownConverter($environment);

The syntax

Embed an icon inline with :icon[prefix:name]:

Click :icon[heroicons:home] to go home.

That renders the heroicons:home icon right inside the paragraph text.

Adding attributes

Pass attributes as space-separated key="value" pairs after the icon name:

:icon[heroicons:user class="w-6 h-6"] Profile
:icon[tabler:star fill="currentColor"] Favorite

Accessible icons

Add aria-label to make an icon meaningful to screen readers:

:icon[heroicons:home aria-label="Home"] Home

Icons go through the same rendering pipeline as swarm_icon(): global defaults, prefix defaults, suffix attributes, and ARIA rules all apply.

A real-world example

This is where the syntax really shines for documentation or help content where authors write Markdown and shouldn’t need to touch PHP:

## Getting Started

1. Click :icon[heroicons:plus-circle] **New Project** to create a project
2. Use :icon[heroicons:cog-6-tooth] **Settings** to configure options
3. Click :icon[heroicons:check-circle] **Save** when done

The icons render inline, right alongside the text. Authors can reference any icon set you’ve configured: they just need to know the prefix:name.