アイコン

このショートコードをインラインで使用するには、設定でインラインショートコードを有効にする必要があります:

hugo.yaml
enableInlineShortcodes: true

利用可能なアイコンのリストは、data/icons.yaml で確認できます。

使用方法

{{< icon "github" >}}

Heroicons v1 のアウトラインアイコンがデフォルトで利用可能です。

独自のアイコンを追加する方法

data/icons.yaml ファイルを作成し、以下の形式で独自のSVGアイコンを追加します:

data/icons.yaml
your-icon: <svg>your icon svg content</svg>

その後、ショートコードで以下のように使用できます:

{{< icon "your-icon" >}}

{{< card icon="your-icon" >}}

ヒント: Iconify Design は、サイト用のSVGアイコンを見つけるのに最適な場所です。

最終更新日