react-line-awesome

Line Awesome Icons as Typescript React Components

Easily add and customize Line Awesome icons in your JS or Typescript React project without clashing with Font Awesome classes.

Installation

• Add the library as a dependency from NPM:

    # yarn
    yarn add react-line-awesome

    # npm
    npm install react-line-awesome

• Add a link to the font files in your project's HTML files:

<link
  rel="stylesheet"
  href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css"
/>

Alternatively, you can link to the Line Awesome stylesheet hosted on your server.

Features

• No dependencies (other than React)
• Simple API that mirrors Font Awesome's class names.
• Add your own classNames, styles and other props (all additional props are passed directly to the component).
• Proper accessibility tags.

Examples

var React = require('react')
import { ThumbsUpIcon } from 'react-line-awesome'

const MinimalExample = () => <ThumbsUpIcon />

const LongerExample = () => (
  <ThumbsUpIcon size="2x" variant="solid" className="..." component="span" style={{ color: 'blue' }}>
    <span>I am a child!</span>
  </ThumbsUpIcon>
)

See the list of all icons available