Custom Color Picker for Color Dropdowns in Viewer

PSPDFKit for Web comes with a custom color picker UI. The custom color picker allows end users to select “new” colors to add to the color dropdown. Each type of dropdown can have a specific end user-picked customizable color pallet.

By default, we render the custom color picker in each color dropdown.

You can use the configuration#annotationToolbarColorPreset API to hide the custom color picker.

Here’s an example of how to remove the custom color picker from all color dropdowns:

PSPDFKit.load({
  annotationToolbarColorPreset: ({
    defaultAnnotationToolbarColorPresets
  }) => ({
    presets: defaultAnnotationToolbarColorPresets,
    showColorPicker: false
  })
  //...
});

Stored in Local Storage

By default, the colors picked using the custom color picker will be stored across sessions on the same browser. Since the colors are stored in local storage, you cannot access them in incognito mode or after a hard reload.

We allow a custom color pallet made of 17 colors. After selecting 17 colors, the end user has to delete colors to be able to add more.