---
title: "JavaScript PDF outlines: Create & generate PDF outlines | Nutrient"
canonical_url: "https://www.nutrient.io/guides/web/bookmarks/outlines/create/"
md_url: "https://www.nutrient.io/guides/web/bookmarks/outlines/create.md"
last_updated: "2026-09-02T09:24:06.387Z"
description: "With Nutrient Web SDK, it’s possible to create PDF outlines programmatically with JavaScript."
---

# Create PDF outlines using JavaScript

With Nutrient Web SDK, it’s possible to create PDF outlines programmatically with JavaScript.

Nutrient Web SDK supports creating, editing, and removing document outlines in standalone mode in the browser. For more information, refer to the [operational mode](https://www.nutrient.io/guides/web/about/operational-modes.md) guide.








Here’s how to create a PDF outline in JavaScript:

```js

const outline = NutrientViewer.Immutable.List([
  new NutrientViewer.OutlineElement({
    action: new NutrientViewer.Actions.GoToAction({ pageIndex: 1 }),
    children: NutrientViewer.Immutable.List([]),
    title: "My outline element 1"
  }),
  new NutrientViewer.OutlineElement({
    action: new NutrientViewer.Actions.GoToAction({ pageIndex: 2 }),
    children: NutrientViewer.Immutable.List([]),
    title: "My outline element 2"
  })
]);

instance.setDocumentOutline(outline);

```

The example above creates an outline with two elements, each with a [`GoToAction`](https://www.nutrient.io/api/web/NutrientViewer.Actions.GoToAction.html) that takes the user to a destination (page 1, page 2) in the current document. There are several other actions you can use with outlines, such as opening a web link, submitting or resetting a form, or executing a script. These are described in the [PDF actions](https://www.nutrient.io/guides/web/annotations/pdf-actions.md) guide.

## Linking to URIs

Using [`URIAction`](https://www.nutrient.io/api/web/NutrientViewer.Actions.URIAction.html), you can link to a website from your outline:

```js

const outline = NutrientViewer.Immutable.List([
  new NutrientViewer.OutlineElement({
    action: new NutrientViewer.Actions.URIAction({
      uri: "https://www.nutrient.io"
    }),
    children: NutrientViewer.Immutable.List([]),
    title: "My outline element"
  })
]);

instance.setDocumentOutline(outline);

```
---

## Related pages

- [Edit PDF outlines using JavaScript](/guides/web/bookmarks/outlines/edit.md)
- [Remove PDF outlines using JavaScript](/guides/web/bookmarks/outlines/remove.md)