BrandLogo

Atom

Brand mark: a logo image (light / dark variants) when given, otherwise a single letter or short token on a primary-coloured tile. 5 sizes (sm → 2xl).

Preview

ABCDE

Code

<BrandLogo size="sm">A</BrandLogo>
<BrandLogo size="md">B</BrandLogo>
<BrandLogo size="lg">C</BrandLogo>
<BrandLogo size="xl">D</BrandLogo>
<BrandLogo size="2xl">E</BrandLogo>

Preview

KUN✓

Code

<BrandLogo size="lg">KU</BrandLogo>
<BrandLogo size="lg" className="bg-secondary">N</BrandLogo>
<BrandLogo size="lg" className="bg-success">✓</BrandLogo>

Preview

Code

<BrandLogo size="lg" alt="Acme" logoLight="/logo-light.svg" logoDark="/logo-dark.svg" />
<BrandLogo size="md" alt="Acme" logoLight="/logo.svg" />

BrandLogo

Default sizes

Custom content

Logo image (light / dark)