Aksel

Meny

Link

Oppdatert Stabil
GithubYarn FigmaEndringslogg

Intro

En link er klikkbar tekst eller grafikk brukt for navigasjon. Komponenten er et enkelt anchor-element med NAV sitt design.

Egnet til:

  • Lenke til nye sider
  • Innholds-snarveier

Uegnet til:

Har du innspill til komponenten?

Send forslag

Eksempler

SandboxSandbox
Åpne eksempel i nytt vindu

Retningslinjer

Lenker

I NAV markerer vi ikke besøkte lenker ("visited").

Tilgjengelighet

Når navigering ved klikk på Link håndteres med onClick, er det viktig å fortsatt ha med en href. Dette gir bruker bedre indikasjon på hva konsekvensen av å klikke på lenken er.

Props

Link

as?

  • Type:
    React.ElementType
  • Description:

underline?

  • Type:
    boolean
  • Default:
    true
  • Description:

inlineText?

  • Type:
    boolean
  • Default:
    false
  • Description:

variant?

  • Type:
    "action" | "neutral" | "subtle"
  • Default:
    "action"
  • Description:

children

  • Type:
    ReactNode
  • Description:

className?

  • Type:
    string

data-color?

  • Type:
    (string & {}) | AkselColor

ref?

  • Type:
    LegacyRef<HTMLAnchorElement>
  • Description:

Tokens

TokenFallback
--ac-link-text--a-text-action
--ac-link-focus-text--a-text-on-action
--ac-link-focus-bg--a-border-focus
--ac-link-focus-border--a-border-focus
--ac-link-active-text--a-text-on-action
--ac-link-active-bg--a-border-focus
--ac-link-active-border--a-border-focus
--ac-link-action-text--a-text-action
--ac-link-neutral-text--a-text-default
--ac-link-subtle-text--a-text-subtle
Hva er dette?

Komponent-tokens gir deg muligheten til å sette opp theming eller justere styling uten å måtte overskrive css-klasser. Les gjennom guiden vår eller utforsk alle design tokens.

Relaterte komponenter