mveytsman / heroicons_elixir

Phoenix components for Heroicons! 🛡️
MIT License
118 stars 28 forks source link
elixir phoenix-liveview

Heroicons

Heroicons are "a set of free MIT-licensed high-quality SVG icons for you to use in your web projects". This package gives you Elixir functions to drop Heroicons into your HTML, styled with arbitrary classes.

This library provides optimized svgs for each Heroicon packaged as a Phoenix Component.

Heroicons are designed by Steve Schoger

Current Heroicons Version: 2.1.5.

Installation

Add Heroicons to your mix.exs:

defp deps do
  [
    {:heroicons, "~> 0.5.5"}
  ]
end

After that, run mix deps.get.

Usage

The components are provided by the Heroicons module. Each icon is a Phoenix Component you can use in your HEEx templates.

By default, the icon components will use the outline style, but the solid, mini or micro attributes may be passed to select styling, for example:

<Heroicons.cake />
<Heroicons.cake solid />
<Heroicons.cake mini />
<Heroicons.cake micro />

You can also pass arbitrary HTML attributes to the components, such as classes:

<Heroicons.cake class="w-2 h-2" />
<Heroicons.cake solid class="w-2 h-2 text-gray-500" />

For a full list of icons see the docs or heroicons.com.