Hopp til innhold
Aksel

Komponenter

List

Lister brukes til å presentere innhold på en kortfattet og oversiktlig måte, for eksempel for å oppsummere hovedpoengene i en tekst.

StabilOppdatert 13. februar 2026
Github FigmaEndringslogg

Egnet til:

  • Oppsummere lengre tekster.
  • Liste opp kriterier.

Uegnet til:

  • Lengre innhold.
  • Rikt innhold som bilder og video (det bryter opp flyten i en liste).

Eksempler

Retningslinjer

Det er ikke så mye å si om List, men hvis du har lyst til å lære mer om hvordan vi skriver lister i Nav kan du se Skriveregler i Nav.

Props

List

as?

  • Type:
    "ul" | "ol"
  • Default:
    "ul"
  • Description:

    HTML list element to render.

size?

  • Type:
    "small" | "medium" | "large"
  • Default:
    "medium"
  • Description:

    Changes margin-block on list and font size on items.

className?

  • Type:
    string

ref?

  • Type:
    Ref<HTMLDivElement>
  • Description:

    Allows getting a ref to the component instance. Once the component unmounts, React will set ref.current to null (or call the ref with null if you passed a callback ref). React Docs

title?

  • Deprecated:
    Use <Heading> instead of `title`.
  • Type:
    undefined

List.Item

children

  • Type:
    ReactNode
  • Description:

    List item content.

title?

  • Type:
    string
  • Description:

    List item title.

icon?

  • Type:
    ReactNode
  • Description:

    Icon to be used instead of bullet (unordered lists only).

className?

  • Type:
    string

ref?

  • Type:
    Ref<HTMLLIElement>
  • Description:

    Allows getting a ref to the component instance. Once the component unmounts, React will set ref.current to null (or call the ref with null if you passed a callback ref). React Docs

Tokens

Komponent-tokens er fjernet i versjon 8

Gammel dokumentasjon for disse finner du på JsDelivery