Migrating from Clearbit
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
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.
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.
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" />
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"
/>
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.
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>
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.