Link

A navigation link styled with the same visual variants as Button.

Variants

Link supports all Button visual variants.

<Link Href="/page">Default</Link>
<Link Href="/page" Variant="ButtonVariant.Secondary">Secondary</Link>
<Link Href="/page" Variant="ButtonVariant.Destructive">Destructive</Link>
<Link Href="/page" Variant="ButtonVariant.Outline">Outline</Link>
<Link Href="/page" Variant="ButtonVariant.Ghost">Ghost</Link>
<Link Href="/page" Variant="ButtonVariant.Link">Link</Link>

Sizes

Use the Size property to change the link size.

<Link Href="/page" Size="ButtonSize.Sm">Small</Link>
<Link Href="/page" Size="ButtonSize.Default">Default</Link>
<Link Href="/page" Size="ButtonSize.Lg">Large</Link>

External Link

Open links in a new tab with the target attribute.

<Link Href="https://github.com" target="_blank" rel="noopener noreferrer">
    GitHub ↗
</Link>

Navigation

Use Link for internal navigation between pages.

<Link Href="components/button">View Button</Link>
<Link Href="components/card" Variant="ButtonVariant.Outline">View Card</Link>
<Link Href="installation" Variant="ButtonVariant.Ghost">Installation</Link>