phosphor_icons

Ruby Phosphor Icons

A gem to easily include Phosphor Icons in your Ruby and Rails apps.

For a full list of available icons see the assets directory or preview them at phosphoricons.com.

Requirements

• Ruby 2.7 or higher

Installation

Install the gem and add to the application's Gemfile by executing:

bundle add phosphor_icons

or add this in your Gemfile

gem "phosphor_icons"

Usage

require "phosphor_icons"

icon = PhosphorIcons::Icon.new("alarm")
icon.to_svg
# <svg class="phosphor-icon" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="24" height="24"><path d="M128,32a96,96,0,1,0,96,96A96.11,96.11,0,0,0,128,32Zm0,176a80,80,0,1,1,80-80A80.09,80.09,0,0,1,128,208ZM61.66,29.66l-32,32A8,8,0,0,1,18.34,50.34l32-32A8,8,0,1,1,61.66,29.66Zm176,32a8,8,0,0,1-11.32,0l-32-32a8,8,0,0,1,11.32-11.32l32,32A8,8,0,0,1,237.66,61.66ZM184,120a8,8,0,0,1,0,16H128a8,8,0,0,1-8-8V72a8,8,0,0,1,16,0v48Z"/></svg>

If you are using Ruby on Rails, you can use phosphor_icon helper in your views directly

<%= phosphor_icon "alarm", class: "h-5 w-5" %>
<%= phosphor_icon "x", height: 48 %>

Documentation

The Icon class takes two arguments. The first is the symbol of the icon, and the second is a hash of arguments representing html attributes.

symbol (required)

This is the name of the Phosphor Icon you want to use. For example alarm. Full list of icons

Options

• :style - Apply a specific style to the icon. Available options are regular (default), bold, light, duotone, fill and thin.
• :height - When setting the height to a number, the icon will scale to that size. For example, passing 24, will calculate the width based on the icon's natural size.
• :width - When setting the width to a number, the icon will scale to that size. For example, passing 24, will calculate the width based on the icon's natural size.

Attributes

Once initialized, you can read a few properties from the icon.

symbol

Returns the string of the symbol name

icon = PhosphorIcons::Icon.new("alarm")
icon.symbol
# "alarm"

style

Returns the style of the icon

icon = PhosphorIcons::Icon.new("alarm", style: :bold)
icon.style
# "bold"

path

Path returns the string representation of the path of the icon.

icon = PhosphorIcons::Icon.new("alarm")
icon.path
# <path d="M128,32a96,96,0,1,0,96,96A96.11,96.11,0,0,0,128,32Zm0,176a80,80,0,1,1,80-80A80.09,80.09,0,0,1,128,208ZM61.66,29.66l-32,32A8,8,0,0,1,18.34,50.34l32-32A8,8,0,1,1,61.66,29.66Zm176,32a8,8,0,0,1-11.32,0l-32-32a8,8,0,0,1,11.32-11.32l32,32A8,8,0,0,1,237.66,61.66ZM184,120a8,8,0,0,1,0,16H128a8,8,0,0,1-8-8V72a8,8,0,0,1,16,0v48Z"/>

options

This is a hash of all the options that will be added to the output tag.

icon = PhosphorIcons::Icon.new("alarm")
icon.options
# {:class=>"phosphor-icon", :viewBox=>"0 0 256 256", :xmlns=>"http://www.w3.org/2000/svg", :fill=>"currentColor", :width=>24, :height=>24}

width

Width is the icon's true width.

icon = PhosphorIcons::Icon.new("alarm", width: 24)
icon.height
# 24

height

Height is the icon's true height.

icon = PhosphorIcons::Icon.new("alarm", height: 24)
icon.height
# 24

Methods

to_svg

Returns a string of the svg tag

icon = PhosphorIcons::Icon.new("alarm")
icon.to_svg
# <svg class="phosphor-icon" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="24" height="24"><path d="M128,32a96,96,0,1,0,96,96A96.11,96.11,0,0,0,128,32Zm0,176a80,80,0,1,1,80-80A80.09,80.09,0,0,1,128,208ZM61.66,29.66l-32,32A8,8,0,0,1,18.34,50.34l32-32A8,8,0,1,1,61.66,29.66Zm176,32a8,8,0,0,1-11.32,0l-32-32a8,8,0,0,1,11.32-11.32l32,32A8,8,0,0,1,237.66,61.66ZM184,120a8,8,0,0,1,0,16H128a8,8,0,0,1-8-8V72a8,8,0,0,1,16,0v48Z"/></svg>

Development

After checking out the repo, run bin/setup to install dependencies. Then, run rake test to run the tests. You can also run bin/console for an interactive prompt that will allow you to experiment.

Contributing

Bug reports and pull requests are welcome on GitHub at https://github.com/maful/ruby-phosphor-icons. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the code of conduct.

License

The gem is available as open source under the terms of the MIT License.

Code of Conduct

Everyone interacting in the PhosphorIcons project's codebases, issue trackers, chat rooms and mailing lists is expected to follow the code of conduct.