Akar Icons

A perfectly rounded icon library made for designers, developers, and pretty much everyone.

For Designers

Explore all icons at akaricons.com. Simply click the icon you'd like to use and paste it to your favorite application (Figma, Sketch, XD).

For developers

Akar icons are currently available as individual React components. Start using it today.

1. Installation

Install with npm:

npm install --save akar-icons

2. Usage

Import the icons you need into your React project and declare them in your render method:

import { ArrowRight, Star, LinkOut } from 'akar-icons';

const MyComponent = () => {
  return (
    <div>
      <ArrowRight />
      <Star />
      <LinkOut />
    </div>
  );
};

export default MyComponent;

Icons can be configured with inline props including inline style objects:

<Star color="yellow" size={32} strokeWidth={3} style={{ display: "block" }}/>

You can also import the whole icon library like this:

import * as Icon from 'akar-icons';

const MyComponent = () => {
  return <Icon.ArrowRight />
};

export default MyComponent;

Explore all icons at akaricons.com.

Author

Arturo Wibawa (@agwibawa)

License

MIT License, Copyright © 2020-present Arturo Wibawa.