Heroicons v2.2 rendered as inline SVG.
The icons ship inside the package (priv/heroicons/heroicons.json, MIT, by
Tailwind Labs) in three styles: "outline" (24px, stroke), "solid" (24px)
and "mini" (20px). Rendering them inline instead of with the hero-*
classes of Phoenix's Tailwind plugin matters for a content editor: those
classes only exist for the icon names Tailwind finds in your source files,
while here the icon is picked at runtime.
<ElementorexCms.Heroicons.icon name="gift" class="size-5" />
<ElementorexCms.Heroicons.icon name="check-circle" style="solid" />Summary
Functions
Whether an icon with that name exists.
Renders an icon. Unknown names render nothing.
Names of every icon (the same in the three styles).
Icons whose name (or a Spanish synonym) contains query, up to limit.
An empty query returns the first icons in alphabetical order.
Available styles: "outline", "solid" and "mini".
The icon as an SVG string, for places that are not HEEx (the editor builds the canvas document as a string).
Functions
Whether an icon with that name exists.
Renders an icon. Unknown names render nothing.
Attributes
name- icon name, e.g."arrow-right"style-"outline"(default),"solid"or"mini"class- classes for the<svg>(size it withsize-*or CSS)- any other attribute is added to the
<svg>(aria-label,data-*...)
Attributes
name(:string) (required)style(:string) - Defaults to"outline".class(:any) - Defaults tonil.- Global attributes are accepted.
@spec names() :: [String.t()]
Names of every icon (the same in the three styles).
@spec search(String.t() | nil, pos_integer()) :: [String.t()]
Icons whose name (or a Spanish synonym) contains query, up to limit.
An empty query returns the first icons in alphabetical order.
@spec styles() :: [String.t()]
Available styles: "outline", "solid" and "mini".
The icon as an SVG string, for places that are not HEEx (the editor builds the canvas document as a string).