Heroicons
Heroicons
Simply find and copy delightful SVG icons
Open source icons by Steve Schoger and Adam Wathan Viewer by Zaydek Michels-Gualtieri
The quickest way to search heroicons and copy the SVG code
Winner of the work smarter award 🏆
It's almost too easy 😂
You can help to improve the product 👇
Questions
  • Q1: What are your first impressions?
    ARMiedema ARMiedema

    Heroicons.dev is a viewer of the heroicons library of open source icons by the creators of Tailwinds. The Github repo is located at https://github.com/refactoringui/heroicons. What makes Heroicons so great is that you can simply search, click, and save an SVG to your clipboard so you can easily drop it into your front-end code.

  • Q2: What are the first actions you take?
    ARMiedema ARMiedema

    The first actions I take is to search for an icon, in this case "home", click on the resulting home icon, which saves the SVG path to my clipboard, then I drop it into some front-end code of mine, swapping out another icon and run to see what it looks like. Glad to say, it picked up the color I had set without having to modify anything. Super easy and convenient!

  • Q3: What was your journey navigating the site like? Does the flow make sense?
    ARMiedema ARMiedema

    The experience currently is simple and straightforward. You can search or browse for an icon to use with over 140 icons to select from.

  • Q4: Who do you believe the target audience is?
    ARMiedema ARMiedema

    Front-end devs looking for elegant icons to use at not cost

  • Q5: Do you find the product desirable?
    ARMiedema ARMiedema

    I love this site. It takes out a common issue with fetching icons straight from GitHub and removes about 3 or 4 clicks. Usually, you'd have to look at a preview file for an image you want to use. Often the icon you want to use isn't labeled which means you then have to guess what the name is. You then have to guess at which folder it might be in, click into the folder to view the image. If you happened on the correct folder, you then have to get the raw SVG. With heroicons.dev it is as simple as search and click. Boom! 🔥

  • Q6: What would you change about the website?
    ARMiedema ARMiedema

    The website is pretty great as is. I like the persistent search bar on scroll down. There is some horizontal movement on the search bar as I enter in text and search results form. There is also a red warning image on some of the icons that I'm not sure why it's there...?