Skip to main content
The classic “which company?” field lets users type a few letters and pick their company from a dropdown of logos. One pick hands you a clean name and domain to store, instead of a hand-typed guess. A user types st, sees Stripe with its logo at the top of the list, and selects it. Each suggestion comes from the Search API, which returns the name, domain, and a ready-to-use logo URL. If you’re migrating from Clearbit’s autocomplete, this is the replacement.

​
Demo

Try typing ni, s, or fig: The logos load live from img.logo.dev, but this demo filters a small local sample instead of calling the Search API; in production the suggestions arrive with the same shape and logos.

​
Build it with AI

Want company search with logos in your app? This prompt gives your AI coding tool everything it needs to build it in your framework.

Open in Cursor

​
Code

This example is in React, but you can get the same result in any frontend framework: the pattern is one server route plus an input that fetches it. api/company-search.ts holds your secret key on the server, CompanyAutocomplete.tsx is the field, and the Usage tab shows the call site. 
export async function GET(request: Request) {
  const q = new URL(request.url).searchParams.get("q")?.trim();
  if (!q) {
    return Response.json([]);
  }

  const res = await fetch(
    `https://api.logo.dev/search?q=${encodeURIComponent(q)}`,
    { headers: { Authorization: `Bearer ${process.env.LOGO_DEV_SECRET_KEY}` } }
  );
  if (!res.ok) {
    return Response.json([], { status: 502 });
  }

  // [{ name, domain, logo_url }]
  return Response.json(await res.json());
}
Your secret key lives in the server route, so the browser only ever talks to your own endpoint.

​
How it works

  • The Search API turns a few letters into companies. A query to api.logo.dev/search returns the name, domain, and a ready-to-use logo_url for each match. See the Search API.
  • Each result ships its own logo URL. Append image parameters like size and format straight onto logo_url instead of doing a second lookup.
  • Your secret key stays on the server. The browser calls your own route, and the route adds the Authorization header before forwarding the query. See API keys.
  • The field behaves like a native picker. Suggestions track your typing, the keyboard moves the highlight, and selecting fills the field. The component above carries the details.

​
Make it your own

  • Return one exact match. Pass strategy=match to the Search API when you want the single best result instead of typeahead suggestions.
  • Store the domain with the record. Feed it to the CRM logos pattern so the logo follows the company through your whole app.

​
Next steps

Search API

Read the full parameters and response shape for /search.

Logo from a domain

Harden the result logos for domains without one.