Overview

This guide is intended for developers who are migrating from Clearbit’s Logo API to Logo.dev’s API. The aim is to ensure a seamless transition while maintaining functionality and consistency in the representation of company logos in your applications.

Clearbit’s Logo API vs. Logo.dev’s API Comparison

Clearbit’s Logo API provides basic access to company logos, while Logo.dev offers similar functionalities with additional features such as greyscale logos, more flexible size parameters, and retina image support.

Migration Steps

1

Sign up for an account to avoid rate-limits

Authenticate in our dashboard and register your site. Logo.dev tracks the referrer for images in order to manage access along with your API key.

Need an API key? Sign up for a free account

By signing up for a free account and registering your site, you’ll have enough requests to manage most projects.

2

Understanding Logo.dev's API Structure

Familiarize yourself with the parameters and usage of Logo.dev’s API as follows:

  • token: String, required, use the API token associated with your account.
  • size: Integer, optional, with a default of 128.
  • format: String, optional, can be either “png” or “jpg” with a default to “jpg”.
  • greyscale: Boolean, optional, desaturates the image if set to true, defaults to false.
3

API Endpoint Changes

Replace the Clearbit API endpoint calls in your application:

From:

<img src="https://logo.clearbit.com/:domain" />

To:

<img src="https://img.logo.dev/:domain?token=YOUR-KEY-HERE" />
4

Handling Optional Parameters

If you’re using optional parameters like size, format, or greyscale, update your API calls to include them according to Logo.dev’s documentation:

Clearbit Example:

<img src="https://logo.clearbit.com/segment.com?size=200&greyscale=true" />

Logo.dev Equivalent:

<img
  src="https://img.logo.dev/segment.com?size=200&greyscale=true&token=YOUR-KEY-HERE"
/>
5

Error Handling for Missing Logos

Logo.dev handles missing logos differently from Clearbit. Instead of providing a 404 error, we provide a fallback image that contains the brand color and first letter of the domain.

If you are using an onerror; function to detect failed images, it’s safe to continue using it but shouldn’t be necessary.

6

Changing your attribution link

Like Clearbit, we also require attribution back to Logo.dev as part of our free offering.

Clearbit:

<a href="https://logo.clearbit.com">Logos provided by Clearbit</a>

Logo.dev:

<a href="https://logo.dev" alt="Logo API">Logos provided by Logo.dev</a>
7

Testing

After making these changes, thoroughly test your application to ensure that logos are displayed correctly and all functionalities work as expected.

Additional Features in Logo.dev

Consider utilizing additional features offered by Logo.dev:

  • Retina Images: Logo.dev supports high-resolution retina images by providing images with double the pixel density.
  • Image Resizing: You can specify any valid integer size for images, though it is recommended to stay under 600px for raster images.

Conclusion

By following this migration guide, you should be able to switch from using Clearbit’s Logo API to Logo.dev’s API without significant issues. Ensure that you review Logo.dev’s documentation in detail to make full use of its capabilities.