Said this in a diff comment, want to build a site that shows different tools. 

And for those I’m designing cards, but when I’m building it I’m looking for a sustainable way to add in new tools without having to do a lot of manual work.

Probably HTML, CSS and Vanilla JS — might look at react for easy composable components.

You could try looking at logo collections like https://svglogos.dev or finding them on https://icones.js.org. Best way would be to download from their website on build and save it locally

`fetch("https://[site.tld]/favicon.ico")` on build. You can try-catch to check for favicon.png as well if the ICO file doesn't exist. Alternatively, parse the HTML for the `<link rel="icon">` and use that as the favicon URL

Why would you need those? Honest question I swear 😊

What are you building the site with, you could probably do this at build time if JS.

About 50+ sites, I want to create cards for tools and gather them on a site.

So dynamically would be preferable, but I’m thinking for now to create a folder that I can load them from.

Oh, I see. You could scrape the favicons when adding the tool, it is a fairly universal and always lives inside the meta tags, so that should be quite easy to download/save. This would mean even less manual work on the long run 🙃

Playing around with creating some custom cards for different tooling but they don’t always have a brand pack (or I can’t seem to find it).

Because I’m specifically looking for rectangular forms of their logos I can use.

How many sites? Do you need to do this dynamically or once?

Saving this comment, thank you once again 🙌🏾

Is there actually a website to easily find favicons of websites?

Yeah obviously… but I’d want an overview so I can easily grab them without having to go their source code

Posts