Getting started

Installation

Add the gem, sync your icon libraries, include the kit.

Add the gem#

glyphs renders the SVGs that rails_icons syncs into your app.

Gemfile

gem "glyphs"

glyphs depends on phlex (~> 2.0) and rails_icons (>= 1.2) — rails_icons brings the sync generator and the icons gem, the pure-Ruby SVG renderer glyphs uses under the hood.

Sync icon libraries#

Skip this if rails_icons is already set up.

rails generate rails_icons:install --libraries=lucide heroicons
rails generate rails_icons:sync --libraries=lucide heroicons

The synced SVGs land in app/assets/svg/icons/<library>/<variant>/ — that's where glyphs reads them at render time and where the Glyphs/IconResolution cop validates icon names at lint time.

Include the kit#

Glyphs is a Phlex::Kit — include it once in your component base class and every library component becomes a capitalized method:

app/components/application_component.rb

class ApplicationComponent < Phlex::HTML
  include Glyphs
end

LucideIcon(:house, class: "size-4")
PhosphorIcon("lock", variant: :bold)
HeroIcon(:check, class: "size-5 text-success")

Outside Rails#

glyphs has no Rails dependency at runtime. Point the icons gem at your SVG tree and render away:

Icons.configure do |config|
  config.base_path = File.expand_path(__dir__)
  config.icons_path = "svg/icons"
end

Glyphs::LucideIcon.new(:house).call # => "<svg ...>"