Octicons gem to distribute octicons svg
Add this to your Gemfile
gem 'octicons'
Then bundle install
.
require 'octicons'
icon = Octicons::Octicon.new("x")
icon.to_svg
# <svg class="octicon octicon-x" viewBox="0 0 16 16" width="16" height="16" version="1.1" "aria-hidden"="true"><path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path></svg>
The Octicon
class takes two arguments. The first is the symbol of the icon, and the second is a hash of arguments representing html attributes
This is the name of the octicon you want to use. For example alert
. Full list of icons
:height
- When setting the height to a number, the icon will scale to that size. For example, passing32
, 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, passing32
, will calculate the width based on the icon's natural size.
If both :width, :height
are passed into the options hash, then the icon will be sized exactly at those dimensions.
Once initialized, you can read a few properties from the icon.
Returns the string of the symbol name
icon = Octicons::Octicon.new("x")
icon.symbol
# "x"
Path returns the string representation of the path of the icon.
icon = Octicons::Octicon.new("x")
icon.path
# <path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path>
This is a hash of all the options
that will be added to the output tag.
icon = Octicons::Octicon.new("x")
icon.options
# {:class=>"octicon octicon-x", :viewBox=>"0 0 12 16", :version=>"1.1", :width=>12, :height=>16, :"aria-hidden"=>"true"}
Width is the icon's true width. Based on the svg view box width. Note, this doesn't change if you scale it up with size options, it only is the natural width of the icon
Height is the icon's true height. Based on the svg view box height. Note, this doesn't change if you scale it up with size options, it only is the natural height of the icon
Returns a string of the svg tag
icon = Octicons::Octicon.new("x")
icon.to_svg
# <svg class="octicon octicon-x" viewBox="0 0 16 16" width="16" height="16" version="1.1" "aria-hidden"="true"><path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path></svg>
Returns an array of keywords for the icon. The data comes from the octicons repository. Consider contributing more aliases for the icons.
icon = Octicons::Octicon.new("x")
icon.keywords
# ["remove", "close", "delete"]
Returns an Integer
representing the codepoint of the character within the font file.
icon = Octicons::Octicon.new("alert")
icon.decimal
# 61485
Returns an String
representing the hexadecimal codepoint of the character within the font file.
icon = Octicons::Octicon.new("alert")
icon.hexadecimal
# "f02d"
Returns the unicode character of the icon. When placing this with the octicons font turned on, you'll see the icon.
icon = Octicons::Octicon.new("alert")
icon.character
# ""
Font License: SIL OFL 1.1 © GitHub