A settings card for a workspace or company logo, with live previews on light and dark backgrounds.
"use client"
import { demoAdapter } from "@/examples/_demo"
import { LogoUpload } from "@/components/logo-upload"
export default function LogoUploadExample() {
return (
<div className="w-full max-w-lg">
<LogoUpload adapter={demoAdapter} name="Acme Inc" />
</div>
)
}
Installation
npx shadcn@latest add @uploadcn/logo-uploadUsage
import { LogoUpload } from "@/components/logo-upload"<LogoUpload name="Acme Inc" onSuccess={(item) => saveLogo(item.result)} />It's a single-file uploader: choosing a new file replaces the current one.
Props
Prop
Type