Uwarp

Akar Icons for rounded line interface iconography

Tool powered by Akar Icons on Akar Icons.

Browse Akar Icons, a free line icon set with 400+ rounded SVGs for product interfaces, with search, copy, and open-source use for design and development.

What is Akar Icons?

Akar Icons is a free, MIT-licensed line icon library built for user interfaces. It offers 400+ consistently rounded vector icons for navigation, actions, content, and system patterns. Use the official Akar Icons browser to search icons, compare style fit, and copy assets into Figma, design systems, and front-end code.

What you can do with Akar Icons

The library gives you a large, cohesive set of line icons for modern product and marketing UI.

  1. Browse 400+ line icons: Explore a single library that covers common interface roles without mixing unrelated visual styles.
  2. Search and copy quickly: Find icons and copy names or code snippets using the official site's workflows.
  3. Rely on rounded, readable geometry: Keep stroke weight and corner treatment consistent when you need clear icons at small sizes.
  4. Use in personal and commercial work: The project is published under the MIT License for flexible adoption in production work.
  5. Pair with code packages: Framework packages and usage patterns are described on the official site for React and other stacks.

How to browse icons from Akar Icons

Follow a short workflow to adopt icons that stay consistent with your system.

  1. Map icon roles in your product: List navigation, status, actions, and content needs before you pick a style.
  2. Search the Akar set first: Use keywords that match the action or object so you land on a close default icon.
  3. Validate at real sizes: Check legibility in toolbars, forms, and dense table rows before locking choices.
  4. Record names and import paths: Store icon identifiers and any framework usage rules next to your component guidelines.

Tips for better icon usage

These practices keep line icons legible and consistent in shipped interfaces.

  1. Label ambiguous actions: Pair icons with text when the action is critical, crowded, or first-time for users.
  2. Keep one line style per surface: Avoid mixing this pack with fill-heavy or outlined-with-filled variants on the same bar.
  3. Respect padding and hit targets: Leave enough space around small glyphs so they stay tappable and visually balanced.
  4. Favor clear metaphors: Choose shapes that read quickly at a glance, especially for state and file types.

Who this icon set is great for

Akar Icons works well for teams that want a single line style across web and app UI.

  1. Product and UX designers: Prototype and ship with a broad catalog that still feels like one system.
  2. Front-end engineers: Integrate SVG or supported packages with predictable naming and export paths.
  3. Design system teams: Standardize a default icon set while you document when to deviate to custom art.
  4. Solo makers: Ship polished UI affordances without hand-drawing a full set from zero.

Benefits of using Akar Icons

A well-documented, open set reduces churn when you need icons across many views.

  1. Single visual language: Rounded line work reads consistent across light and dark themes when tuned with your colors.
  2. High coverage in one place: Large libraries reduce the need to hunt third-party one-offs for missing glyphs.
  3. Faster handoff to code: Clear naming and copy flows shorten the path from design choice to production.
  4. Open licensing for scale: MIT terms support commercial products without blocking internal reuse.

Frequently Asked Questions

Have questions? We have answers.

Related tools

More tools from Icons & Graphics.

View all Icons & Graphics