Skip to content

Add any icon library to a Rails app. Support for Feather, Lucide, Heroicons, Tabler and others

License

Notifications You must be signed in to change notification settings

Rails-Designer/rails_icons

Repository files navigation

Rails Icons

Add any icon library to a Rails app. Rails Icons has first-party support for a handful of libraries. It is library agnostic so it can be used with any icon library using the same interface.

# Using the default icon library
<%= icon "check", class: "text-gray-500" %>

# Using any custom library
<%= icon "apple", library: "simple_icons", class: "text-black" %>

The icons are sourced directly from their respective GitHub repositories, ensuring Rails Icons remain lightweight.

Sponsored By Rails Designer

Rails Designer logo

Install

Add the gem

bundle add rails_icons

Install, choosing one of the supported libraries

rails generate rails_icons:install --libraries=LIBRARY_NAME

Example

rails generate rails_icons:install --libraries=heroicons

Or multiple at once
rails generate rails_icons:install --libraries=heroicons lucide

Usage

# Uses the default library and variant defined in config/initializer/rails_icons.rb
icon "check"

# Use another variant
icon "check", variant: "solid"

# Set library explictly
icon "check", library: "heroicons"

# Add CSS
icon "check", class: "text-green-500"

# Add data attributes
icon "check", data: { controller: "swap" }

# Set the stroke-width
icon "check", stroke_width: 2

First-party libraries

Animated icons

Rails Icons also includes a few animated icons. Great for loading states and so on. These are currently included:

  • faded-spinner
  • trailing-spinner
  • fading-dots
  • bouncing-dots

Use like this: icon "faded-spinner", library: "animated". The same attributes as other libraries are available.

Custom icon library

Need to use an icon from another library?

  1. run rails generate rails_icons:initializer --custom=simple_icons;
  2. add the (SVG) icons to the created directory app/assets/svg/icons/simple_icons;

Every custom icon can now be used with the same interface as first-party icon libraries.

icon "apple", library: "simple_icons", class: "text-black"

Sync icons

If a library gets updated, sync the icons to your app by running

rails generate rails_icons:sync --libraries=LIBRARY_NAME

Example

rails generate rails_icons:sync --libraries=heroicons

# Or multiple at once:
rails generate rails_icons:sync --libraries=heroicons lucide

Contributing

This project uses Standard for formatting Ruby code. Please make sure to run be standardrb before submitting pull requests. Run tests via rails test.

License

Rails Icons is released under the MIT License.