PHPackages klickmanufaktur/statamic-fontawesome-icon-picker - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. klickmanufaktur/statamic-fontawesome-icon-picker ActiveStatamic-addon[Utility & Helpers](/categories/utility) klickmanufaktur/statamic-fontawesome-icon-picker ================================================ Searchable, virtualized FontAwesome icon picker fieldtype for Statamic. v1.0.0(today)00proprietaryPHPPHP ^8.2 Since Jul 1Pushed todayCompare [ Source](https://github.com/klickmanufaktur/statamic-fontawesome-icon-picker)[ Packagist](https://packagist.org/packages/klickmanufaktur/statamic-fontawesome-icon-picker)[ Docs](https://github.com/klickmanufaktur/statamic-fontawesome-icon-picker)[ RSS](/packages/klickmanufaktur-statamic-fontawesome-icon-picker/feed)WikiDiscussions main Synced today READMEChangelogDependencies (1)Versions (2)Used By (0) FontAwesome Icon Picker ======================= [](#fontawesome-icon-picker) A searchable, virtualized FontAwesome (Pro) icon picker fieldtype for Statamic 6. - Search in **English and German** – every icon carries baked-in German keywords. - **Style tabs** (Solid, Regular, Light, Thin, Brands) – configurable per field. - **Virtualized grid** – only the rows in the viewport exist in the DOM, so even the full 3,600+ icon set scrolls smoothly. - Stores a **ready-to-use class string** (`fa-solid fa-rocket`) – drop it straight into a `class` attribute. Requirements ------------ [](#requirements) - PHP 8.2+ - Statamic 6 / Laravel 12 - A **FontAwesome Pro** npm token – required only to build the CP assets and to regenerate the icon data, not at runtime. Installation ------------ [](#installation) This package is consumed as a local path repository. In the host app's `composer.json`: ``` "repositories": { "statamic-fontawesome-icon-picker": { "type": "path", "url": "../_packages/statamic-fontawesome-icon-picker" } } ``` ``` composer require klickmanufaktur/statamic-fontawesome-icon-picker ``` > **FontAwesome Pro required.** The compiled CP assets and the icon datasets are derived from FontAwesome Pro and are **not** shipped with this package (Pro assets may not be redistributed). After installing, build them once with your own FA Pro token — see below. Building the CP assets ---------------------- [](#building-the-cp-assets) Required once after installing (the assets and icon data are not shipped) and again whenever you change the Vue component or styles. Provide your FA Pro token first (see `.npmrc.example`): ``` cp .npmrc.example .npmrc # then insert your FA Pro token npm install npm run build-icons # generate resources/js/data (needs FA Pro metadata) npm run build # generate resources/dist/cp ``` The host app serves CP assets from a **published copy** in `public/vendor/statamic-fontawesome-icon-picker`, not from the addon directly, so after every build re-publish them (otherwise the CP keeps loading the old bundle): ``` php artisan vendor:publish --tag=statamic-fontawesome-icon-picker --force ``` Regenerating the icon data -------------------------- [](#regenerating-the-icon-data) `npm run build-icons` (run above) reads the FA Pro metadata from `node_modules`and writes the datasets to `resources/js/data`. Re-run it after a FontAwesome version bump. Solid/Regular/Light/Thin share the same icon set, so they are baked into a single `fa-classic.json`; brand logos go into `fa-brands.json`. An icon only carries a `w` (weights) list when it does **not** ship in every classic weight – the picker treats a missing `w` as "available in all classic weights". German keywords are generated word-by-word via the EN→DE map inside `bin/build-icons.mjs`; extend that map to improve German search coverage. Migrating legacy data --------------------- [](#migrating-legacy-data) Earlier versions of a site may have stored only the bare icon name (e.g. `rocket`) and prepended the style in the template. This fieldtype stores the full class string (`fa-regular fa-rocket`). The bundled command rewrites the old values in place across all entries, globals and taxonomy terms: ``` php artisan fontawesome-icon-picker:migrate --dry-run # preview php artisan fontawesome-icon-picker:migrate # apply ``` - Brand icons are detected via `fa-brands.json` and written as `fa-brands …`; everything else uses `--classic-style` (default `regular`). - Values already in the new format are skipped, so the command is idempotent and safe to run repeatedly. - `--handles=` overrides which field handles are scanned (default `icon,button_icon,page_theme_icon`); `--force` skips the confirmation prompt. Usage ----- [](#usage) Add the fieldtype to a blueprint or fieldset: ``` fields: - handle: icon field: type: fontawesome_icon display: Icon ``` ### Configuration [](#configuration) OptionDescriptionDefault`styles`Which style tabs are offered in the picker.`solid`, `regular`, `light`, `brands``default_style`Preselected style when the picker opens.`regular`### Templating (Antlers) [](#templating-antlers) The stored value is a full class string, so render it directly: ``` {{ if icon }}{{ /if }} ``` The fieldtype's `augment()` guarantees the value is always a well-formed `fa-{style} fa-{name}` string (anything else is discarded), so `{{ icon }}` is safe without `|raw`. ### Health Score 39 — LowBetter than 85% of packages Maintenance100 Actively maintained with recent releases Popularity0 Limited adoption so far Community6 Small or concentrated contributor base Maturity45 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Unknown Total 1 Last Release 0d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/b80f38d3fb1038793a61dc319681b9e6ee954acefca113cf37781171e90beb7f?d=identicon)[klickmanufaktur](/maintainers/klickmanufaktur) --- Top Contributors [![klickmanufaktur](https://avatars.githubusercontent.com/u/30047394?v=4)](https://github.com/klickmanufaktur "klickmanufaktur (2 commits)") --- Tags iconaddonFontAwesomestatamiccontrol panel ### Embed Badge ![Health badge](/badges/klickmanufaktur-statamic-fontawesome-icon-picker/health.svg) ``` [![Health](https://phpackages.com/badges/klickmanufaktur-statamic-fontawesome-icon-picker/health.svg)](https://phpackages.com/packages/klickmanufaktur-statamic-fontawesome-icon-picker) ``` ### Alternatives [statamic/seo-pro 68516.6k](/packages/statamic-seo-pro)[marcorieser/statamic-livewire A Laravel Livewire integration for Statamic. 23111.5k13](/packages/marcorieser-statamic-livewire)[withcandour/aardvark-seo Save time and get your Statamic site to rank better with the SEO addon for Statamic. 15133.0k](/packages/withcandour-aardvark-seo)[visuellverstehen/statamic-classify A useful helper to add CSS classes to all HTML tags generated by the bard editor. 20119.8k](/packages/visuellverstehen-statamic-classify)[justkidding96/aardvark-seo Save time and get your Statamic site to rank better with the SEO addon for Statamic. 155.4k](/packages/justkidding96-aardvark-seo)[aerni/livewire-forms A Statamic forms framework powered by Laravel Livewire 2915.1k](/packages/aerni-livewire-forms) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)