Logotype
Responsive brand logo that adapts to the space it is given.
Installation
pnpm add @plainconceptsplatform/ui-componentsUsage
import { PlainLogo } from "@plainconceptsplatform/ui-components";
<PlainLogo />Preview
PlainLogo uses CSS container queries (no JavaScript) to show the biggest mark that fits
its parent: the icon in tight spaces, the wordmark at medium widths, and the full
lockup when wide. Text follows currentColor (works in light/dark); the brand mark stays blue.
Under ~190px it shows the icon, up to ~460px the wordmark, and wider it shows the full lockup.
Pass className to constrain size:
<PlainLogo className="h-8 w-40" />