Link

Navigation

Versatile link component for navigation and actions with multiple variants and automatic external link detection

Inline Links

Standard text links with underline options

Default (hover underline)

Visit our documentation

Always underlined

Read the terms and conditions

No underline

Simple link without underline

External link

Disabled

Button-styled Links

Links styled as buttons for prominent calls-to-action. These match our Button component styles exactly.

Primary

Small Medium Large

All Variants

Primary Secondary Outline Ghost Destructive

With Icons

External Link Continue

Disabled

Primary Outline

Navigation Links

Links for sidebar and navigation menus with active state

Breadcrumb Links

Specialized breadcrumb navigation with automatic separators

Subtle Links

Low-emphasis links for secondary actions

View details
Learn more

Common Patterns

Real-world usage examples

Product Update

We've released new features to help you work faster.

Read the changelog

About Privacy Terms Contact

Ready to get started?

Create your account today.

Props

Complete API reference

Prop	Type	Default	Description
variant	string	inline	inline \| button \| nav \| subtle
buttonVariant	string	primary	Button style when variant="button"
size	string	md	sm \| md \| lg \| xl (for button variant)
external	boolean	false	Opens in new tab, auto-detected for http(s) URLs
underline	string	hover	always \| hover \| none
active	boolean	false	For navigation links
disabled	boolean	false	Disables the link
leftIcon	ReactNode	-	Icon before text
rightIcon	ReactNode	-	Icon after text

Features

Auto External Detection - Automatically detects external URLs and adds appropriate attributes
Multiple Variants - Inline, button, nav, and subtle styles
Icon Support - Left and right icon positions
Active State - Built-in active state for navigation
Keyboard Accessible - Full keyboard navigation and focus states
All Button Variants - Primary, secondary, outline, ghost, and destructive styles