Link

Navigation

A styled anchor element for navigation. Use links for inline navigation, external references, or any clickable text that navigates to another page.

Import

import { Link } from "@/components/ui/link";

Usage

Variants

Different link styles for various contexts

Sizes

Links in different text sizes

External Links

Links to external websites with icon indicator

In Text

Links used within paragraph text

For more information about our products, visit the product catalog or check out our main website.

API Reference

PropTypeDefaultDescription
href*stringThe URL to navigate to
variant"default" | "primary" | "muted" | "subtle" | "nav""default"Visual style of the link
size"sm" | "md" | "lg""md"Text size of the link
externalbooleanForce external link behavior
showExternalIconbooleantrueShow external link icon for external URLs

Related Components