shadcn registry

Every logo is a shadcn registry item. The CLI writes one self-contained component per logo into your project — no package, no runtime dependency.

1. Install logos

@logoforge is listed in the official shadcn registry directory, so the CLI knows it out of the box — nothing to configure in a project already set up with shadcn.

Terminal

npx shadcn@latest add @logoforge/stripe

# several at once
npx shadcn@latest add @logoforge/vercel @logoforge/supabase @logoforge/github

Each logo lands in components/logos/<logo>.tsx. You can also install from the full URL, which works with any shadcn version:

Terminal

npx shadcn@latest add https://logoforge.terravidhal.me/r/stripe.json

On an older CLI that doesn't know the directory yet, declare the namespace once in components.json:

components.json

{
  "registries": {
    "@logoforge": "https://logoforge.terravidhal.me/r/{name}.json"
  }
}

2. Use it

app/page.tsx

import { StripeLogo } from "@/components/logos/stripe";

export default function Page() {
  return <StripeLogo className="size-10" />;
}

Props and dark mode are covered in React component. The component name is the logo's slug in PascalCase plus Logo — it's shown on every logo page.

Updating a logo

Brands redraw their marks. Re-run the command with --overwrite to pull the current version:

Terminal

npx shadcn@latest add @logoforge/stripe --overwrite

Registry endpoints

Index: /r/registry.json
One item: /r/<logo>.json — e.g. /r/stripe.json

Both are static files: no token, no rate limit, CORS open.