Embed any library's icon in your Rails app. There are many icon gems for Rails already, but none are library-agnostic. This means you need to pull in other gems or add your logic to display that one specific icon.
Supported libraries:
Sponsored By Rails Designer
Add this line to your Gemfile:
gem "rails_icons"
And run:
bundle
# The default library is Heroicons, with "outline" as the default set
icon "check"
# Use another set (options are: outline, solid, mini, micro)
icon "check", set: "solid"
# Add CSS to the icon
icon "check", class: "text-green-500"
# Add data attributes
icon "check", data: { controller: "swap" }
# Tweak the stroke-width
icon "check", stroke_width: 2
RailsIcons.configure do |config|
# Set the default set for the library
config.default_library = "heroicons" # https://heroicons.com/
config.default_set = "outline" # other sets for Heroicons are: solid, mini, micro
config.libraries.heroicons.solid.default.css = "w-6 h-6"
config.libraries.heroicons.solid.default.data = {}
config.libraries.heroicons.outline.default.css = "w-6 h-6"
config.libraries.heroicons.outline.default.stroke_width = "1.5"
config.libraries.heroicons.outline.default.data = {}
config.libraries.heroicons.mini.default.css = "w-5 h-5"
config.libraries.heroicons.mini.default.data = {}
config.libraries.heroicons.micro.default.css = "w-4 h-4"
config.libraries.heroicons.micro.default.data = {}
end
Or run rails generate rails_icons:initializer
.
RailsIcons.configure do |config|
# …
config.libraries.merge!(
{
custom: {
simple_icons: {
solid: {
path: "app/assets/svg/simple_icons/solid", # optional: the default lookup path is: `app/assets/svg/#{library_name}/#{set}`
default: {
css: "w-6 h-6"
}
}
}
}
}
)
# …
end
You can now use any svg-icon in the app/assets/svg/simple_icons/solid
folder as a first-party icon:
icon "reddit", library: "simple_icons", set: "solid"
Rails Icons is released under the MIT License.