react-line-awesome

React components for Line Awesome Icons

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
react-line-awesome
1.4.13 months ago5 years agoMinified + gzip package size for react-line-awesome in KB

Readme

Line Awesome Icons as Typescript React Components
code style: prettier View on npm
Easily add and customize Line Awesome icons in your JS or Typescript React project without clashing with Font Awesome classes.

Installation

  1. Add the library as a dependency from NPM:

# yarn
yarn add react-line-awesome

# npm
npm install react-line-awesome

  1. 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