Production-ready icons for designers and developers

Up and running in seconds, no npm, no dependencies, full control over your files.
Here's how it works:
Figma software logo
215 icon components for Figma
UICraft icon examplename: link-1
UICraft icon example
React
Vue
Angular
// React usage
import Icon from "./components/uicraft-icons"
...
<Icon name="link-1 "size="256" />
<Icon name="link-1 "size="128" color="DeepPink" />
<Icon name="link-1 "size="64" />
<Icon name="link-1 "size="40" color="#228BE6" />
<Icon name="link-1 "size="32" />
<Icon name="link-1 "size="24" />
...
uicraft.io
Give it a try!

Essential Pack

85 icons | Free for personal use only
Download the Essential PackSee the icons
Convinced?

Full Pack

215 icons | For personal and commercial use
Get the Full Pack - $9.99See the icons
What's the difference between this and other icon packs?
215+ Icons

Growing with time

We regularly add new icons to the pack, and you get all the latest updates for a year.

Digital first

Designed for digital

UICraft Icons are designed from scratch for digital products, apps and websites, not bags, print, or other mediums.

Style

The right balance

We aimed to strike the right balance between funky and serious, abstract and literal, startup and enterprise.

Scale

Works at any size

Icons scale up and down to any size without losing legibility, meaning or quality.

Design components

Figma

Figma components, editable paths + rasterised version for each icon.

Code components

React, Vue, Angular

Production optimised icon component for React, Vue and Angular.

Complete control

You are in control

No automatic updates. You get the updates via email in a zip file, up to you from thereon.

Governance

Easy to manage

Each icon has a unique name in the design library and code components. Easy to manage and collaborate. No surprises.

Essential Pack

Free for personal use only
  • 85 Figma editable components and flattened icons
  • React, Vue & Angular icon components
  • One optimised JSON file for all icons

Full Pack

For personal and commercial use
  • 215 Figma editable components and flattened icons
  • 215 individual SVG & transparent PNG’s @2x
  • React, Vue & Angular icon components
  • One optimised JSON file for all icons
  • Free updates for a year
v1.3 - Last updated: 5th Feb 2022 – Changelog

FAQ

What files are included in the React component?

uicraft-icons.js
uicraft-icons.json

What files are included in the Vue component?

uicraft-icons.js
uicraft-icons.json

What files are included in the Angular component?

uicraft-icons.css
uicraft-icons.html
uicraft-icons.json
uicraft-icons.spec.ts
uicraft-icons.ts

Why are the files listed in a grouped grid?

The grouping creates a visual hierarchy that makes the icons list easy to digest.

There's an entire psychology theory around this and it's really interesting. It's called Gestalt approach. You can read more about it on the Verywellmind blog, article by Kendra Cherry(@AboutPsychology)

I lost or didn't receive the download link

It's ok; these things can happen. Please check the email Junk/Spam folder and if it's not there, please get in touch and give us your details(Full name and Email address), and we will send you a copy if your details match our records. Get in touch

Any other question?
Ask us on Twitter or get in touch