Skip to content

Quick Start

You’ve installed the package. Now let’s get an icon on screen.

  1. Download your first icon set

    Swarm Icons ships with a CLI that pulls icon sets straight from npm: no Node.js needed. Grab Tabler Icons to start:

    Terminal window
    vendor/bin/swarm-icons json:download tabler

    This saves the full Tabler set as a JSON file in resources/json/. You can download as many sets as you want: Material Design Icons, Heroicons, Lucide, and 200+ others are all available.

  2. Wire it up

    Create a small bootstrap file (or add this to your existing one):

    use Frostybee\SwarmIcons\SwarmIcons;
    use Frostybee\SwarmIcons\SwarmIconsConfig;
    $manager = SwarmIconsConfig::create()
    ->discoverJsonSets()
    ->cachePath(__DIR__ . '/cache/icons')
    ->defaultPrefix('tabler')
    ->build();
    SwarmIcons::setManager($manager);

    That’s the entire setup. discoverJsonSets() finds every JSON file you’ve downloaded and makes it available. defaultPrefix('tabler') means you can write 'home' instead of 'tabler:home' for your most-used set.

  3. Render an icon

    Now, anywhere in your app:

    echo swarm_icon('home');

    That’s it. You’ll get a clean <svg> tag with aria-hidden="true" applied automatically.

    Want to customize it? Chain fluent methods: each one returns a new immutable icon:

    echo swarm_icon('home')->size(32)->class('text-blue-500');

Need icons from different sets? Download them and reference by prefix:

Terminal window
vendor/bin/swarm-icons json:download mdi heroicons
echo swarm_icon('home'); // tabler (your default)
echo swarm_icon('mdi:account'); // Material Design
echo swarm_icon('heroicons:check-circle'); // Heroicons

Every set gets its own prefix. No conflicts, no ambiguity.

JSON collections are the recommended path, but you have options.

Your own SVG files: point at a directory and go:

->addDirectory('custom', __DIR__ . '/resources/icons')

Live Iconify API: zero setup, fetches icons over HTTP on first use:

->addIconifySet('heroicons')

Both at once: local files first, API as fallback:

->addHybridSet('icons', __DIR__ . '/my-icons')

Each approach is covered in detail in the Providers section.

Now that you have icons rendering, you might want to:

  • Understand the architecture: Core Concepts explains providers, prefixes, and how attributes flow through the system.
  • Fine-tune your setup: The Configuration Builder covers caching, default attributes, aliases, and more.
  • Explore the CLI: Browse and search across 200+ icon sets to find exactly what you need.