A perfectly rounded icon library made for designers, developers, and pretty much everyone.
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).
Akar icons are currently available as individual React components. Start using it today.
Install with npm:
npm install --save akar-icons
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" }}/>
Prop | Description | Default |
---|---|---|
color |
Set the icon color | currentColor |
size |
Set the width and height of the svg icon | 24 |
strokeWidth |
Set the stroke width of the icon | 2 |
style |
Add inline styles to the element | {} |
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.
Arturo Wibawa (@agwibawa)
MIT License, Copyright © 2020-present Arturo Wibawa.