Show HN: Instant search of 200K+ SVG logos from 100 sources | Hacker News Reader

Show HN: Instant search of 200K+ SVG logos from 100 sources

logosear.ch

251 pointsFileformat45 comments

I often need to find logos and was not impressed by the existing logo search engines, so, in classic bikeshed mode, I built my own. Because it makes total sense to try to compete with Google. And Wikipedia. And countless others (some of which I list on the alternatives page).

Why is mine better?

  - just logos
  - instant results
  - only SVGs
  - hyperlinked directly to the source
  - no right-click hijacking (or other dark patterns)
  - totally awesome domain name

It is open source (AGPLv3), so you can see the tools I use and how it works (and criticize my code). The sources have their own licenses, so be sure to check there before using.

It is still a work in progress and there are some glitches (I mean, who would use a percent sign in a file name? And I'd love to try to fix the Wikipedia redirected images if I could only find the source...), but I want to see if people find it useful.

So let me know what you think! And I'm always looking for more sources!

You were not kidding about the 'instant results' part. I like that, as well as the domain name.

.ch is great!

Looks useful.

Feedback: the result rendering is very "jumpy" due to logos loading in one at a time.

You could either render sized wrapper containers for each logo, or load them in in the background and only show them once ready (with a loading indicator somewhere).

I have tried various solutions, but nothing that works better than what's there now.

I only force the height for the logos, not the width, so wrapping doesn't really improve things.

Waiting to display until they are all loaded kills the "instant" tagline. I'm hotlinking the images, so some images can take awhile.

In theory you should be able to get the natural height and width of the image before loading it. Not exactly sure if it works with SVGs but it does work with PNGs

Yeah, you could get the size of the images at indexing time, and return that in the search result.

You are assuming that I actually load the image at index time: I'm really only indexing the file name.

And getting the width/height of a minimized SVG requires rendering it (or at least more SVG mojo than I possess).

He's suggesting your index store the filename, height & width, and retrieve all 3 on search

It's a non-issue, don't sweat it.

You can use preconneft tags to make the browser preconneft to the likely source of the images. This usually gives a pretty big boost in speed because browsers will have already connected (DNS + TLS handshake) to the icon source's CDN.

Did not find a logo for Logosear.ch though!

Heh. You got me! That'll be an easy one to fix though

Thanks for building this! I actually obsess about having high quality logos for companies in the pitchbooks I write, so have built a personal collection over time... it's not big, but it has the companies I care about.

Some things I thought I'd share from that experience:

* The hardest thing is knowing which logo is actually the most recent and therefore correct. Searching logosear.ch for, say, IBM, yields countless logos that are virtually identical, as well as some of their products (which is fine) but also many old logos like this[0], which I don't think is what your user would want to find 9 out of 10 times (i.e. as a user, if I'm looking for a niche / ancient logo, I don't mind doing the research on my own and understand it will take a while. But when I want "the right logo", I'll consider visiting a specialized logo search engine to get the right result and get it fast)

* In my experience, The best sources for finding the company logo in SVG format are:

- company website header (hit or miss as SVG adoption at first was slow, but it's increasingly good for S&P 500 type companies and tech-savvy firms... anything outside of that venn diagram is pretty bad)

- Wikipedia page either in English or in the language matching the company's headquarter (i.e. better luck with German companies in de.wikipedia.org)

- For large companies where both of the above fail, I search for "company name filetype:pdf" and look for vector logos embedded into those files, then use Adobe Acrobat to extract them in a very manual and ugly process by deleting unnecessary pages / content and cropping, and then visiting cloudconvert.com to generate a SVG (hey, it works...)

* One final comment is PowerPoint doesn't take SVG files, so I always have to convert them to .emf or .wmf before dropping them in, so maybe you should consider exporting your SVG file in other formats too, though probably not limited to just those two

––––––––––

0. https://commons.wikimedia.org/wiki/File:IBM_Logo_1956_1972.s...

Would you be willing to share your collection of high-quality logos with the community? I can index any github or gitlab repo with logos.

A lot of the current sources are people's personal collections that they have shared.

This is actually how I started: I made my personal collection into a website (https://www.vectorlogo.zone/). My collection is more curated, definitely in terms of size/layout, and hopefully more current, but curation is a lot of work, and not what I'm trying to do on LogoSear.ch.

I do have an SVG to PNG converting working on VLZ. I think there are open SVG to EMF/WMF libraries, so I could add that as well, but I would need some help testing it since I'm not a big PowerPoint user. Would you be willing to help?

PowerPoint does support inserting SVG files. Microsoft added SVG support a few years ago, but it might only be available for 365 subscribers.

Very cool... I think I found a bug, in that results from a prior entry would come up on a new entry...

For example, I typed mercedes, then selected all and amg over that... in the end, some mercedes results showed on the amg screen... should probably tag your search request with the value in the input, and abandon the request/results if they no longer match.

Sigh. I hate debugging timing related issues that I cannot duplicate. But I already include the input in the search results API response, so your suggestion should work. I'll try it shortly.

This is so good. I'm currently working on about 100 pages worth of content for our website and adding attribution+integrations to our partners we work with. The headache I'm having just Google'ing their SVG logos is about 2-3 minutes per logo. So about 15 minutes per page just looking for logos. So far, the last 5-6 I could remember were all included.

What's the source for these images? ie. None of our competitors have their SVG logos indexed.

The images all link to their source. The complete list of sources is https://logosear.ch/sources/index.html

I'm glad to see you're pulling from the CNCF landscape, where we have 1,400 individual curated SVGs. There are another few thousand across the other Linux Foundation landscapes referenced at https://landscapes.dev/.

(Up-to-date list is https://github.com/cncf/landscapeapp/blob/master/landscapes.... .)

Thanks! I'll add them right away!

Bare in mind that a lot of theses aren't the company's logos. They're copies people have made, and got wrong. If your parters are going to see their logo on whatever you're making it's probably a good idea to make sure you're using their actual company logo.

I searched for Twitter - https://logosear.ch/search.html?q=twitter Literally none of those are Twitter's actual logo. They're all subtly wrong (dimensions, color, aspect ratio, etc). In a few cases they're wildly off. If I can't trust this as a source I'd still have to look up the real one. Maybe it's less of a problem for smaller companies whose logos won't get cloned as much, but if I put any of those Twitter logos in a presentation of a website I don't think I'd impress anyone.

Nicely done!

I've spot-checked few logos that I need at the moment, and most of them are already there. However, I've noticed that there is no IndieHackers logo in the database.

I wonder if it is possible to come up with the tool where you would enter the Home Page Url and the tool would then output an SVG file of round or square shape that could be used as an SVG icon to represent links to that site (from my site).

The tool could try to detect the logo image on the home page of the target site, vectorize and normalize it into square or circle. Or it could try to locate a Favicon in SVG format, if present. Or, if nothing else works, it could fall into some default case when the SVG icon would be created from the most dominant color (of the target site) and 1 or 2 letters of the site name.

Do you guys know of any such tool? Thanks!

There are a few sites that do this, though none with SVGs. Search for "logo api" finds ClearBit and RiteKit, among others.

On a somewhat related topic: is anyone aware of an algorithm that would let people find related/similar symbols? On the symbology sub-reddit the most common question is "what is this symbol" and it would be very helpful to provide a kind of search engine.

Neural network -> feature vectors.

Your comment made me think of [0], you might be able to find out how it works.

[0]: https://detexify.kirelabs.org/classify.html

Unicode symbol search: http://shapecatcher.com/

LaTeX symbol search: http://detexify.kirelabs.org/classify.html

I wrote a Sketch plugin[1] to search and insert SVG logos.

[1] https://github.com/soulchild/sketch-logo-fetcher

While collecting over a thousand SVGs for https://landscape.cncf.io, I found that the SVGs often needed cropping and other optimization. So (with a colleague) I wrote and open sourced svg-autocrop, and made it available at https://autocrop.cncf.io.

Try it out for optimizing your SVGs.

That looks like a super-useful tool! Thanks!

I wrote this extension to easily copy SVG's with right-click.

https://chrome.google.com/webstore/detail/svg-2-clipboard/pa...

Wow. That's pretty cool! Bummer that nothing comes up when you search for logosear.?ch ;-).

Recursion detected! Stack overflow. Core dumped.

Nice! I've needed something like this several times.

Two suggestions:

1. Almost gave up on waiting for it to load... thought the blank white page meant it was broken or getting the HN-hug-of-death. Maybe add a loading indicator?

2. There are "No matches for 'Logosear.ch'"

I'm hosting on Google Cloud Run, and I turned up the max instances, so this is a good test. It seems to be handling it okay (though not perfectly) at the moment...

This is great, getting logos off sites is so tedious. What about the legality of using the logos (for example, to use AWS logos for certain purposes, you have to be a partner). Is that an issue for you to host the logos?

That's the beauty of a search engine: I'm not hosting the logos. They are all hot-linked from the original source. Any takedown requests need to be sent to the source, not to me.

And github, gitlab and wikipedia all allow hotlinking.

The sources (each images is hyperlinked to its source) have their own licenses: the Wikipedia detail pages go into gory detail. The git repos hopefully have a LICENSE file.

One neat side use for this is if you want to check if a company name is taken and how good is their logo.

Logointern.com works pretty well too

Woah nice this works without JS, I wasn't expecting that !

That's pretty useful!

I'm surprised you could get the domain.

Really fast! Nicely done.

Reply on news.ycombinator.com