---
title: "Add signature field to PDF Form in JavaScript | Nutrient SDK"
canonical_url: "https://www.nutrient.io/guides/web/forms/create-edit-and-remove/add-signature-field/"
md_url: "https://www.nutrient.io/guides/web/forms/create-edit-and-remove/add-signature-field.md"
last_updated: "2026-05-19T11:59:04.504Z"
description: "Learn to add a signature field to your PDF forms using JavaScript with Nutrient SDK. Create interactive documents that capture electronic signatures seamlessly."
---

# Adding a signature field to a PDF form

A signature form field can be added to a PDF document programmatically or by using the [built-in user interface](https://www.nutrient.io/guides/web/forms/create-edit-and-remove/built-in-ui.md). Here’s how to programmatically add a signature form field, which can then be used as a placeholder for [electronic signatures](https://www.nutrient.io/guides/web/signatures/overview.md#electronic-signatures):

```js

const widget = new NutrientViewer.Annotations.WidgetAnnotation({
  id: NutrientViewer.generateInstantId(),
  pageIndex: 0,
  boundingBox: new NutrientViewer.Geometry.Rect({
    left: 200,
    top: 300,
    width: 150,
    height: 75
  }),
  formFieldName: "my signature form field"
});
const formField = new NutrientViewer.FormFields.SignatureFormField({
  name: "my signature form field",
  annotationIds: NutrientViewer.Immutable.List([widget.id])
});
await instance.create([widget, formField]);

```

[Try for Free](https://www.nutrient.io/sdk/web/getting-started.md)

[Launch Demo](https://www.nutrient.io/demo/add-signature-field/)
---

## Related pages

- [Build a browser form template builder](/guides/web/forms/browser-form-template-builder.md)
- [PDF form field flags](/guides/web/forms/create-edit-and-remove/form-field-flags.md)
- [Create fillable PDF forms using JavaScript](/guides/web/forms/form-creation.md)
- [Remove form fields from PDFs using JavaScript](/guides/web/forms/create-edit-and-remove/remove-fields.md)
- [Edit PDF form fields using JavaScript](/guides/web/forms/create-edit-and-remove/edit-fields.md)
- [JavaScript PDF Form Creator](/guides/web/forms/create-edit-and-remove/built-in-ui.md)