Skip to content

ComponentsTextLink

Components

TextLink

Accent links with a 3px-offset underline at 40% of the text colour (100% on hover and keyboard focus), inherit-colour links at 65%, external links with an opens-in-new-tab description, icons, disabled.

Accent and inherit

Accent: #6da7ec / #184f95. inheritColor keeps the surrounding ink (here text-muted #898781) with the line at 65%. Transitions: colour, decoration colour and focus shadow, 60ms.

light
Learn more about usage limits

Size of the conversation text. Font licenses

By continuing you agree to the usage guidelines.

Plain class override: 40% line

dark
Learn more about usage limits

Size of the conversation text. Font licenses

By continuing you agree to the usage guidelines.

Plain class override: 40% line

External
Inherit colour (prop and provider)

Read the guidelines first.

Your plan renews soon. Manage billing

Icons, underline, states

An icon moves the underline to the label; external='with-icon' adds ArrowUpRight. underline=false shows the line on hover / focus only. Disabled links are .4 and inert.

With icon / hover-only / button / disabled