> ## Documentation Index
> Fetch the complete documentation index at: https://docs.lovable.dev/llms.txt
> Use this file to discover all available pages before exploring further.
# Connect your app to Logo.dev
> Connect your app to Logo.dev to display company logos by domain, stock ticker, or crypto symbol directly in the browser from your Lovable app.
export const connector_0 = "Logo.dev"
[Logo.dev](https://www.logo.dev/) is a logo and brand image API that lets your Lovable app display company logos by domain, stock ticker, or crypto symbol. It's designed for apps that show company branding, such as directories, dashboards, CRMs, and portfolio trackers.
With Logo.dev, your app can:
* Display company logos by domain in the browser
* Render logos for stock tickers, ISINs, and crypto symbols
* Add brand logos to dashboards, directories, and profile cards
* Use `img.logo.dev` URLs with size, format, and theme options
The Logo.dev connector is frontend-only. It uses a publishable key with the `img.logo.dev` image CDN, so logos load directly in the browser. It's a good fit when your app needs to show company branding without managing image assets yourself.
This connector provides a publishable key for the `img.logo.dev` image CDN only. Logo.dev's server-side REST and Search APIs need a separate secret key that this connector does not provide.
## Common use cases and example apps
| Example app | Example prompt | Description |
| -------------------------------- | ----------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Company directory** | *Use Logo.dev and build a company directory with a logo next to each company name.* | **Show recognizable branding in a list of companies.**
The app renders each company's logo from its domain through `img.logo.dev`. |
| **CRM or customer dashboard** | *Use Logo.dev and add company logos to our customer list, keyed by their website domain.* | **Make customer records easier to scan with logos.**
The app looks up each customer's domain and displays the matching brand logo. |
| **Stock or portfolio tracker** | *Use Logo.dev and build a watchlist that shows a logo next to each stock ticker.* | **Add company branding to financial data.**
The app renders ticker logos through `img.logo.dev/ticker/` alongside prices and stats. |
| **Crypto tracker** | *Use Logo.dev and build a crypto dashboard with a logo for each coin.* | **Pair market data with recognizable coin logos.**
The app renders crypto logos through `img.logo.dev/crypto/` next to each asset. |
| **Investor or startup database** | *Use Logo.dev and build a startup database where each company card shows its logo.* | **Turn a list of domains into branded company cards.**
The app fetches logos by domain and displays them on profile and detail cards. |
| **Vendor or integrations page** | *Use Logo.dev and build a partners page that shows each vendor's logo in a grid.* | **Render a clean logo wall from a list of domains.**
The app loads each vendor's logo from `img.logo.dev` with consistent sizing. |
## How to connect Logo.dev
Workspace **admins** and **owners** can connect Logo.dev.
You can create multiple Logo.dev connections using different publishable keys, which is useful for separating environments (for example, development and production) or using keys with different domain restrictions.
When the connection is created, Logo.dev becomes available across all projects in the workspace. Anyone building in a project can ask Lovable in chat to link their project to it.
### Prerequisites
Before connecting Logo.dev, make sure you have:
* A Logo.dev account
* A Logo.dev publishable key (starts with `pk_`)
* Lovable workspace owner or admin role
Logo requests through this connector count toward your Logo.dev plan. Billing and quota are handled directly by Logo.dev, not Lovable.
### Step 1: Get a Logo.dev publishable key
A publishable key lets your Lovable app load logos from the `img.logo.dev` image CDN in the browser. Because it's used in frontend code, you secure it with domain restrictions rather than keeping it secret.
To create a Logo.dev publishable key:
Sign in to [Logo.dev](https://www.logo.dev/dashboard/api-keys).
Go to the **API keys** page in your dashboard.
Copy a publishable key (it starts with `pk_`). Create one if you don't have it yet.
Restrict the key to the domains where your app runs. This limits where the key can be used once it's in your frontend code.
The publishable key is exposed in your app's frontend code, so set domain restrictions in Logo.dev to control where it can be used. Use a publishable key (`pk_`), not a secret key. You'll need it in the next step.
See Logo.dev documentation for more: [Logo.dev API keys](https://www.logo.dev/docs/platform/api-keys).
### Step 2: Connect Logo.dev to Lovable
You can create multiple connections using different publishable keys.
Go to **Connectors → App connectors** and select **Logo.dev**.
Click **Add connection**.
1. **Display name**: name the connection, for example `Logo.dev Prod`. This name is only used inside Lovable to identify the connection.
2. **Publishable key**: paste your Logo.dev publishable key (it starts with `pk_`).
Under **Who can access this connection**, decide who in your workspace can use the connection:
* **Only you** (default): only the person creating the connection can use it and its associated data.
* **Invite specific people**: only you and explicitly added workspace members can use the connection and its associated data.
* **Invite entire workspace**: click **Invite entire workspace** to make the connection available to everyone in your Lovable workspace.
See [Connection-level access](/integrations/introduction#connection-level-access) for more information.
Click **Connect**.
When connected, anyone building in a project can ask Lovable in chat to link their project to Logo.dev (based on configured connection-level access). Your Lovable apps can then load company logos directly in the browser through `img.logo.dev`.
## Limitations
The Logo.dev connector is frontend-only and cannot:
* Call Logo.dev's server-side REST API or Search API (those need a separate secret key this connector does not provide)
* Proxy logo requests through a Lovable gateway (logos load directly in the browser from `img.logo.dev`)
* Refresh or rotate keys automatically. To rotate, create a new publishable key in Logo.dev and update the Lovable connection
* Support per-end-user Logo.dev login. Each connection represents a single Logo.dev account shared across all projects linked to it.
## How to unlink projects from a {connector_0} connection
Editors and above can remove specific projects from a connection without deleting the connection entirely. The connection will remain available for other projects.
To unlink projects:
Open **Connectors**, then go to **App connectors**, and select **{connector_0}**.
Open the connection you want to manage.
Under **Linked projects**, check the projects you want to unlink.
Click **Unlink projects** and confirm.
When unlinked, those projects will no longer have access to {connector_0} through this connection. If a project needs {connector_0} again, you can link it to any available connection.
## How to delete a {connector_0} connection
Workspace admins and owners can delete {connector_0} connections. Other members can delete a connection if they created it, or if they have been explicitly granted access to it.
Deleting a connection is permanent and cannot be undone. It will remove the credentials from all linked projects, and any apps using this connection will stop working until a new connection is added.
Before deleting, review the **Linked projects** section to see which projects are currently using the connection.
To delete a connection:
Open **Connectors**, then go to **App connectors**, and select **{connector_0}**.
Open the connection you want to remove.
Review the **Linked projects** section.
Under **Delete this connection**, click **Delete** and confirm.