---
title: "Customize annotation toolbar in Flutter PDF viewer | Nutrient"
canonical_url: "https://www.nutrient.io/guides/flutter/user-interface/toolbars/annotation-toolbar/"
md_url: "https://www.nutrient.io/guides/flutter/user-interface/toolbars/annotation-toolbar.md"
last_updated: "2026-05-15T09:08:03.628Z"
description: "The annotation toolbar in Nutrient is designed to be flexible and highly configurable. This guide details how to customize the annotation toolbar."
---

# Customizing the annotation toolbar in our Flutter viewer

The annotation toolbar in Nutrient is designed to be flexible and highly configurable. This guide details how to customize the annotation toolbar.

## Presentation

You can show or hide the annotation toolbar using the annotation button in the main toolbar.

| Android                                                                                                                                         | iOS                                                                                                                                     |
| ----------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
|  |  |

### Custom annotation toolbar grouping

Since Nutrient Flutter SDK version 3.9, you can customize the annotation toolbar grouping through [`PdfConfiguration`](https://pub.dev/documentation/nutrient_flutter/latest/nutrient_flutter/PdfConfiguration-class.html) on iOS and Android. You can add, remove, or reorder the annotation tools in the toolbar. The example below shows how to customize the annotation toolbar grouping:

```dart

PdfConfiguration(
    annotationToolsGrouping: [
      AnnotationToolbarItem.square,
      AnnotationToolbarItem.line,
      AnnotationToolbarItem.eraser,
      AnnotationToolsGroup(
          type: AnnotationToolbarItem.markup,
          items: [
            AnnotationToolbarItem.strikeout,
            AnnotationToolbarItem.highlight,
            AnnotationToolbarItem.underline
          ]),
    ],
);

```

On Web, the annotation tools are part of the main toolbar; grouping for the main toolbar can be customized from the main toolbar. For more information, refer to our [customizing the main toolbar](https://www.nutrient.io/guides/flutter/user-interface/toolbars/main-toolbar.md#web) guide.

## Using custom buttons

To add a custom button to the annotation toolbar, refer to our [video tutorial and blog post about how to bridge native iOS code to Flutter](https://www.nutrient.io/guides/flutter/customize.md#the-use-case).

### Annotation preset customization

You can customize the default properties of annotation tools using the `PspdfkitViewController.setAnnotationConfigurations` method. This allows you to define how each annotation type will appear when created:

```dart

pspdfkitViewController.setAnnotationConfigurations(
  {
    AnnotationTool.inkPen: InkAnnotationConfiguration(
      color: Colors.red,
      thickness: 10,
      fillColor: Colors.white,
      alpha: 0.5,
    ),
    AnnotationTool.freeText: FreeTextAnnotationConfiguration(
      color: Colors.red,
      fontSize: 40,
      fillColor: Colors.white,
      alpha: 0.5,
    ),
    AnnotationTool.highlight: MarkupAnnotationConfiguration(
      color: Colors.yellow.withOpacity(0.4),
    ),
    AnnotationTool.stamp: StampAnnotationConfiguration(
              availableStampItems: ['Approved', 'Draft', 'Final'],
    ),
  },
);

```

#### Available configuration types

Nutrient provides specialized configuration classes for each annotation type:

- `InkAnnotationConfiguration` — Pen, highlighter, Magic Ink, eraser, signature

- `LineAnnotationConfiguration` — Line, arrow, polyline, distance measurement

- `FreeTextAnnotationConfiguration` — Free text, callout

- `ShapeAnnotationConfiguration` — Square, circle, polygon, area measurement

- `MarkupAnnotationConfiguration` — Highlight, underline, strikeout, squiggly

- `StampAnnotationConfiguration` — Stamp and image annotations

- `ReductionAnnotationConfigurations` — Redaction tools

- `NoteAnnotationConfiguration` — Note annotations
---

## Related pages

- [Customizing the toolbar in our Flutter viewer](/guides/flutter/user-interface/toolbars/main-toolbar.md)