Directive

Links

variant='link' — medium weight in the brand color, always underlined. Works on anchors and router links alike.

Default

<a wrTypography variant="link" href="…">ngwr on GitHub</a>

Inline in a paragraph

Inherits the surrounding font size; weight, colour and a permanent underline mark it. The underline is not decoration — brand colour alone measures 2.72:1 against body text, under the 3:1 that would let colour carry a link on its own.

<p wrTypography variant="body">
  … the <a wrTypography variant="link" href="…">getting started guide</a> …
</p>

The quickest way to get going is the getting started guide — install, wire the theme, import a component.

With icon

<!-- `<wr-icon>` takes no size input — it reads --wr-icon-size, which
     defaults to 1.2em, so beside link text it is already proportional.
     Override the property when you want a specific size. -->
<a wrTypography variant="link" href="…">
  Read the changelog
  <wr-icon name="arrow-forward" style="--wr-icon-size: 0.875rem" />
</a>