@fortawesome/free-regular-svg-icons

What is @fortawesome/free-regular-svg-icons?

@fortawesome/free-regular-svg-icons is a package that provides a collection of free regular icons from Font Awesome. These icons can be used in web applications to enhance the user interface with visually appealing and consistent iconography.

What are @fortawesome/free-regular-svg-icons's main functionalities?

Importing Icons

This feature allows you to import specific icons from the package. In this example, the 'faAddressBook' icon is imported for use in a project.

import { faAddressBook } from '@fortawesome/free-regular-svg-icons';

Using Icons with React

This feature demonstrates how to use the imported icons in a React component. The 'FontAwesomeIcon' component is used to render the 'faAddressBook' icon within a React application.

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faAddressBook } from '@fortawesome/free-regular-svg-icons';

function App() {
  return (
    <div>
      <FontAwesomeIcon icon={faAddressBook} />
    </div>
  );
}

Using Icons with Vue

This feature shows how to use the icons in a Vue.js application. The 'library.add' method is used to add the 'faAddressBook' icon to the library, and the 'FontAwesomeIcon' component is registered for use in Vue components.

import { library } from '@fortawesome/fontawesome-svg-core';
import { faAddressBook } from '@fortawesome/free-regular-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';

library.add(faAddressBook);

export default {
  components: {
    FontAwesomeIcon
  }
};

Other packages similar to @fortawesome/free-regular-svg-icons

@fortawesome/free-solid-svg-icons

This package provides a collection of free solid icons from Font Awesome. It is similar to @fortawesome/free-regular-svg-icons but offers solid versions of the icons, which are filled rather than outlined.

@fortawesome/free-brands-svg-icons

This package offers a collection of free brand icons from Font Awesome. It includes icons for various brands and logos, making it useful for applications that need to display brand-specific icons.

react-icons

The react-icons package provides a wide range of icons from various icon libraries, including Font Awesome, Material Design, and more. It offers a more extensive selection of icons compared to @fortawesome/free-regular-svg-icons and is designed specifically for React applications.

material-icons

This package provides Material Design icons from Google. It offers a different style of icons compared to Font Awesome, focusing on the Material Design aesthetic. It is a good alternative for projects that prefer the Material Design look.

README

@fortawesome/free-regular-svg-icons - SVG with JavaScript version

"I came here to chew bubblegum and install Font Awesome 6 - and I'm all out of bubblegum"

Installation

$ npm i --save @fortawesome/free-regular-svg-icons

Or

$ yarn add @fortawesome/free-regular-svg-icons

Documentation

Get started here. Continue your journey here.

Or go straight to the API documentation.

Issues and support

Start with GitHub issues and ping us on Twitter if you need to.