What is font-awesome?
The font-awesome npm package provides a convenient way to incorporate Font Awesome icons into web projects. Font Awesome is a popular icon set and toolkit that includes scalable vector icons that can be customized with CSS. It can be used in web design and development to enhance the user interface with icons for various purposes such as social media, UI controls, branding, and more.
What are font-awesome's main functionalities?
Adding Icons
This code sample demonstrates how to add a camera retro icon from Font Awesome into HTML. The 'fa' and 'fa-camera-retro' classes are used to apply the specific icon's styles.
<i class='fa fa-camera-retro'></i>
Size Customization
This code sample shows how to customize the size of an icon using the 'fa-lg' class for a larger size. Font Awesome provides additional classes like 'fa-2x', 'fa-3x', etc., to further adjust the icon size.
<i class='fa fa-camera-retro fa-lg'></i>
Animated Icons
This code sample illustrates how to create an animated spinning icon using the 'fa-spin' class. Font Awesome also offers the 'fa-pulse' class for a pulsing animation effect.
<i class='fa fa-spinner fa-spin'></i>
Stacked Icons
This code sample demonstrates how to stack icons on top of each other using the 'fa-stack' class. The 'fa-stack-1x' and 'fa-stack-2x' classes are used to layer the icons, and 'fa-inverse' is used to invert the color of the top icon.
<span class='fa-stack fa-lg'><i class='fa fa-square fa-stack-2x'></i><i class='fa fa-twitter fa-stack-1x fa-inverse'></i></span>
Other packages similar to font-awesome
material-icons
Material Icons are a set of icons from Google's Material Design language. They offer a different aesthetic compared to Font Awesome and are often used in material design themed applications.
ionicons
Ionicons is an open-sourced icon set created by the Ionic Framework team. It provides a collection of icons for use in web, iOS, Android, and desktop applications. Ionicons have a distinct style and are optimized for mobile apps.
glyphicons
Glyphicons is a library of precisely prepared monochromatic icons and symbols, created with an emphasis on simplicity and easy orientation. They were commonly used in Bootstrap 3 but have since been replaced by Font Awesome in Bootstrap 4 for its larger set of icons and more flexible features.
The iconic font and CSS framework
Font Awesome is a full suite of 675 pictographic icons for easy scalable vector graphics on websites,
created and maintained by Dave Gandy.
Stay up to date with the latest release and announcements on Twitter:
@fontawesome.
Get started at http://fontawesome.io!
License
- The Font Awesome font is licensed under the SIL OFL 1.1:
- Font Awesome CSS, LESS, and Sass files are licensed under the MIT License:
- The Font Awesome documentation is licensed under the CC BY 3.0 License:
- Attribution is no longer required as of Font Awesome 3.0, but much appreciated:
Font Awesome by Dave Gandy - http://fontawesome.io
- Full details: http://fontawesome.io/license/
Changelog
Contributing
Please read through our contributing guidelines.
Included are directions for opening issues, coding standards, and notes on development.
Versioning
Font Awesome will be maintained under the Semantic Versioning guidelines as much as possible. Releases will be numbered
with the following format:
<major>.<minor>.<patch>
And constructed with the following guidelines:
- Breaking backward compatibility bumps the major (and resets the minor and patch)
- New additions, including new icons, without breaking backward compatibility bumps the minor (and resets the patch)
- Bug fixes, changes to brand logos, and misc changes bumps the patch
For more information on SemVer, please visit http://semver.org.
Author
Component
To include as a component, just run
$ component install FortAwesome/Font-Awesome
Or add
"FortAwesome/Font-Awesome": "*"
to the dependencies
in your component.json
.
Hacking on Font Awesome
Before you can build the project, you must first have the following installed:
From the root of the repository, install the tools used to develop.
$ bundle install
$ npm install
Build the project and documentation:
$ bundle exec jekyll build
Or serve it on a local server on http://localhost:7998/Font-Awesome/:
$ bundle exec jekyll -w serve