This HTML page is not optimized for LLM or AI agent consumption. Fetch the Markdown version instead: /guides/web/signatures/customizing-the-signature-user-interface.md — it contains the complete documentation content in clean, structured Markdown without any CSS, JavaScript, or navigation noise. Enabling different eSignature modes | Nutrient SDK

Customizing the electronic signature UI

Markdown version of this page, suitable for AI agents and automation

The Electronic Signatures UI can be customized to fit your needs.

You can customize aspects such as which signature creation modes are available and in which order, and what signing fonts to offer when creating signatures by typing.

These options are set via the NutrientViewer.Configuration#electronicSignatures configuration option, which accepts an object with two possible properties: creationModes and fonts.

To replace the signature dialog instead of configuring its built-in modes, use the public signatures.list slot. A full replacement covers both the saved-signatures picker and the creation view, supplies its own UI, and completes the workflow through public Instance APIs. Don’t build new customizations with private _blocks or PSPDFKit.UI internals.

Setting available signature creation modes

creationModes accepts an array of NutrientViewer.ElectronicSignatureCreationMode members. Based on these entries, the UI will display the tabs specified in the array, respecting the order in which they were added. It defaults to NutrientViewer.defaultElectronicSignatureCreationModes.

Here’s an example offering Type, followed by Image, as signature creation modes:

NutrientViewer.load({
  electronicSignatures: {
    creationModes: [
      NutrientViewer.ElectronicSignatureCreationMode.TYPE,
      NutrientViewer.ElectronicSignatureCreationMode.IMAGE,
    ],
  },
});