All components

NAVIGATION / COMPONENTS

Link

Make destinations recognizable.

Live component3 documented props

About link

A link is used to link other pages to a document. When users click on links on web pages, they are brought to other web pages or websites.

01

Anatomy

Shared parts, named consistently.

  1. 1
    Before

    A slot to place an icon before the label.

  2. 2
    LabelRequired

    The Link’s label

  3. 3
    After

    A slot to place an icon after the label.

Try the default

A working example with the shared V1 visual language.

When to use

Use a link for navigation. Describe the destination and announce when it opens a new tab.

Tab focuses and Enter follows the link. Native browser link actions remain available.

Related components

Source & adaptation

V1 semantic colors, DM Sans typography, compact controls, and responsive layouts. The API table describes this implementation; source design notes may use earlier API terminology.

components/library/navigation.tsx