Logo

The Synergy wordmark logo rendered as an inline SVG. Inherits currentColor for easy theming.

Installation

pnpmnpmyarnbun

pnpm dlx shadcn@latest add https://ui.synergyshock.com/r/synergy/logo.json

Usage

import { Logo } from "@/components/ui/synergy/logo"

export default function App() {
  return <Logo className="h-8" />
}

Examples

Sizing

Control the size with standard Tailwind utilities.

<Logo className="h-6" />
<Logo className="h-10" />
<Logo className="h-16" />

Custom Color

The SVG uses currentColor, so set the color with Tailwind or inline styles.

<Logo className="h-10 text-blue-500" />

API Reference

Props

Prop	Type	Default	Description
className	string	—	CSS class applied to the <svg> element.
...props	React.ComponentProps<"svg">	—	Any standard SVG attributes.