https://github.com/adamkiss/kirby-icons-heroicons
Heroicons as snippets for Kirby CMS
https://github.com/adamkiss/kirby-icons-heroicons
heroicons kirby kirby-plugin
Last synced: 3 months ago
JSON representation
Heroicons as snippets for Kirby CMS
- Host: GitHub
- URL: https://github.com/adamkiss/kirby-icons-heroicons
- Owner: adamkiss
- License: mit
- Created: 2022-05-25T17:46:53.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-04-27T23:25:20.000Z (over 1 year ago)
- Last Synced: 2025-06-22T19:05:48.225Z (4 months ago)
- Topics: heroicons, kirby, kirby-plugin
- Language: PHP
- Homepage: https://heroicons.com
- Size: 993 KB
- Stars: 11
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Heroicons for Kirby
A set of 450+ free MIT-licensed high-quality SVG icons for you to use in your Kirby CMS Projects.
Packaged as a set of Kirby snippets, allowing you to embed them easily. Check out the original project for more information.
## Installation
Either download the folder and copy it to your `site/plugins/` folder, or with composer:
``` bash
composer require adamkiss/kirby-icons-heroicons
```
## Usage
``` php
// use an icon as is
snippet('heroicons/solid/check');
// or
snippet('heroicons/mini/check');
// or add additional classes
snippet('heroicons/outline/check', [
'class' => 'red-color',
'attributes' => 'aria-hidden="true" data-hook="something"' // You can also add custom attributes
'strokeWidth' => 3 // Outline icons have a modifiable stroke width as well
]);
```
Available variants/sizes:
- outline (24px)
- solid (24px)
- mini (20px)
- micro (16px)
By default, no class is used, and the default attribute is `aria-hidden="true"`. If you add an attribute and want to keep the `aria-hidden` attribute, you have to add it as well.
## Icon Field support (WIP)
When you install Heroicons and Icon Field at the same time, you can use all Heroicons as the options in the Icon Field:
```php
// in your config.php, configure icon-field to use Heroicons by default
'tobimori.icon-field' => [
'folder' => fn() => \Heroicons::folder(),
'sprite' => fn() => \Heroicons::sprite(),
],
```
```yml
# In your bluprints, keep the icon field folder/sprite blank for the
# default to to be picked upw
fields:
icon:
label: Icon
type: icon
max: 1
```
And then, once the you've set up the icon in the panel, you can use it in your templates/snippets like so:
```php
= snippet("heroicons/mini/{$page->icon()}") ?>
```
For more information, you can check out the [Kirby Icon Field documentation](https://github.com/tobimori/kirby-icon-field#readme).
## License
MIT (c) 2024 Adam Kiss for the plugin, Tailwind Labs for the Heroicons