> ## Documentation Index
> Fetch the complete documentation index at: https://www.logo.dev/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Use Logo.dev in v0

> Add company logos to a v0 app with one paste-in prompt. v0 writes the integration; you supply your publishable key.

v0 writes the integration for you: paste one prompt into the chat and it wires Logo.dev into your app. You supply a publishable key. The prompt below covers everything else.

## Prerequisites

* A Logo.dev [publishable key](/docs/platform/api-keys) (`pk_…`). [Sign up free](https://www.logo.dev/signup) if you don't have one; your key is on the dashboard under **API keys**.

<Steps>
  <Step title="Copy the prompt and fill in your key">
    Replace both `LOGO_DEV_PUBLISHABLE_KEY` placeholders with your real key before pasting:

    ```text theme={null}
    Add company logos to this app using Logo.dev.

    Logo.dev's Logo API returns any company's logo as a cacheable image
    URL. No SDK, just an <img> tag with a publishable key.

    My publishable key (safe in client code): LOGO_DEV_PUBLISHABLE_KEY

    Render a logo from a company domain:

    <img
      src={`https://img.logo.dev/${domain}?token=LOGO_DEV_PUBLISHABLE_KEY`}
      alt={`${domain} logo`}
      width={128}
      height={128}
    />

    The same CDN looks up by other identifiers, just swap the path:
    name/Stripe, ticker/AAPL, crypto/BTC, isin/US0378331005.

    Query params: size (pixels, default 128, max 800), format (jpg,
    png, webp), theme (auto, light, dark), retina=true for high-DPI,
    fallback (monogram by default, or 404).

    A missing logo returns a monogram with 200 OK by default, so
    images never break.

    Create a reusable CompanyLogo component and use it everywhere the
    app shows a company.

    Docs: https://www.logo.dev/docs/logo-images/introduction
    ```
  </Step>

  <Step title="Paste it into v0's chat">
    Send the prompt as a message in the same chat where you're building the app. v0 adds a `CompanyLogo` component and swaps it into the views that show companies.
  </Step>

  <Step title="Check a logo renders">
    Ask the preview to show a company you recognize. If the image is a plain monogram instead of the real logo, the key is usually still the placeholder: search the generated code for `LOGO_DEV_PUBLISHABLE_KEY` and replace it.
  </Step>
</Steps>

## Keep the key out of the repo

A publishable key is built for client-side code, so shipping it in the generated app is fine. To tidy it away anyway, a follow-up prompt like "move the Logo.dev key into an environment variable" does it; v0 generates Next.js, so the variable needs the `NEXT_PUBLIC_` prefix to reach the browser.

<Note>
  On the free tier, commercial projects need a visible attribution link back to
  Logo.dev; personal projects don't. [Paid plans](https://www.logo.dev/pricing)
  remove it. Details on the [attribution page](/docs/platform/attribution).
</Note>

Building in [Lovable](/docs/integrations/lovable) or [Bolt](/docs/integrations/bolt) instead? The same prompt works there.

## Next steps

<CardGroup cols={2}>
  <Card title="Next.js integration" href="/docs/integrations/nextjs" icon="code">
    Taking the v0 export further: Image config and components.
  </Card>

  <Card title="Logo API parameters" href="/docs/logo-images/get" icon="image">
    Every size, format, theme, and fallback option.
  </Card>
</CardGroup>